/* Dental Directory thumbnail override */
.table-style .listing-table td:first-child {
  text-align: center !important;
  vertical-align: middle;
}

.table-style .listing-table td:first-child img {
  width: 90px !important;
  height: 90px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  display: block !important;
  margin: 0 auto !important;
  float: none !important;
}


/* Dental Directory: shrink the two CTA buttons */
a.but_hand_right.large-b.m-right10,
a.but_info.large-b{
  font-size: 14px !important;
  padding: 10px 18px !important;
  line-height: 18px !important;
  border-radius: 24px !important;
}

/* === PUBLIC PROFILE PHOTO MODERNIZATION (2026) === */
img.imgProfile,
img.imgProfile.thin-gray-border {
  width: 140px !important;
  height: 140px !important;
  border-radius: 50% !important;
  object-fit: cover;

  /* subtle “logged-in style” */
  border: 5px solid #fff !important;
  box-shadow: 0 2px 3px rgba(0,0,0,0.25) !important;
  background: #fff;
}

/* Mobile */
@media (max-width: 480px) {
  img.imgProfile,
  img.imgProfile.thin-gray-border {
    width: 120px !important;
    height: 120px !important;
  }
}


/* === PUBLIC PROFILE PHOTO FIX (selector correction) === */
img.thin-gray-border[id*="imgProfile"],
img.thin-gray-border[id*="_imgProfile"] {
  width: 140px !important;
  height: 140px !important;
  border-radius: 50% !important;
  object-fit: cover !important;

  border: 5px solid #fff !important;
  box-shadow: 0 2px 3px rgba(0,0,0,0.25) !important;
  background: #fff !important;
}

@media (max-width: 480px) {
  img.thin-gray-border[id*="imgProfile"],
  img.thin-gray-border[id*="_imgProfile"] {
    width: 120px !important;
    height: 120px !important;
  }
}


/* Dental Directory: make provider thumbnails circular with subtle shadow */
.table-style .listing-table td:first-child img[src*="/DentistryResporatory/ProfileImages/ThumbNails/"] {
  border-radius: 9999px !important;
  box-shadow: 0 6px 16px rgba(0,0,0,0.12) !important;
  display: inline-block;
}

/* === ED: Dental Directory thumb circle + shadow (keep current size) === */
/* Targets thumbs rendered inside the directory listing table */
.listing-table td:first-child img,
.table-style .listing-table td:first-child img {
  display: inline-block !important;
  border-radius: 9999px !important;
  background: #fff !important;
  /* subtle shadow like publicprofile */
  box-shadow: 0 6px 14px rgba(0,0,0,0.14) !important;
  /* ensure the circle crops non-square logos */
  object-fit: cover !important;
}

/* Some rows use inline height/width; ensure we don't distort but still crop */
.listing-table td:first-child img {
  overflow: hidden !important;
}

/* Make sure the cell allows the shadow to be visible */
.listing-table td:first-child,
.table-style .listing-table td:first-child {
  overflow: visible !important;
  position: relative;
  z-index: 2;
}

/* -------------------------------------------------
   Dental Directory — circular thumbnails + shadow
   Matches actual DOM: listing-table first column img
   ------------------------------------------------- */
table.listing-table td:first-child img {
  border-radius: 50% !important;
  box-shadow: 0 6px 14px rgba(0,0,0,0.18) !important;
  object-fit: cover;
}


/* -------------------------------------------------
   Dental Directory — circular thumbnails + shadow
   Actual DOM: <table class="listing-table"> ... <td> <img ...>
   ------------------------------------------------- */
table.listing-table td:first-child img {
  border-radius: 50% !important;
  box-shadow: 0 6px 14px rgba(0,0,0,0.18) !important;
  object-fit: cover;
}

/* 2026-02-24: mobile centering mend for public /dentaldirectory */
@media only screen and (max-width: 760px) {
  /* center the directory wrapper */
  .table-style {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    float: none;
    left: auto;
    right: auto;
    transform: none;
  }

  /* ensure the responsive wrapper isn't offset */
  .table-style .table-responsive {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 0;
    padding-right: 0;
  }

  /* keep the table itself centered */
  .table-style .listing-table {
    margin-left: auto;
    margin-right: auto;
  }
}

/* 2026-02-24: /dentaldirectory mobile fix — neutralize injected responsive table padding */
@media only screen and (max-width: 760px){

  /* scope to public directory grid only */
  #subscribers-grid .table-responsive td{
    padding-left: 0 !important;
  }

  /* prevent the pseudo-label column from forcing a left gutter */
  #subscribers-grid .table-responsive td:before{
    width: auto !important;
    left: auto !important;
    padding-right: 0 !important;
    white-space: normal !important;
    display: block !important;
    position: relative !important;
    margin: 0 0 6px 0 !important;
  }
}

/* 2026-02-24: /dentaldirectory — override JS-injected mobile responsiveTableCss (padding-left:50%) */
@media only screen and (max-width: 760px){
  .table-responsive td{
    padding-left: 0 !important;      /* neutralize the push-right */
    text-align: center !important;   /* match the centered look you want */
  }
  .table-responsive td:before{
    position: static !important;     /* stop left:6px positioning */
    width: auto !important;          /* stop 45% label column */
    display: block !important;       /* label sits above value */
    margin: 0 0 6px 0 !important;
    padding: 0 !important;
    white-space: normal !important;
    text-align: center !important;
  }
}

/* 2026-02-24: /dentaldirectory mobile fix — prevent any 50% width constraints (scoped) */
@media only screen and (max-width: 760px){
  #subscribers-grid,
  #subscribers-grid .table-style,
  #subscribers-grid .table-responsive,
  #subscribers-grid table.listing-table{
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* 2026-02-24: /dentaldirectory mobile grid fix
   Neutralize JS-injected responsiveTableCss (padding-left:50%) AND keep full-width cards
*/
@media only screen and (max-width: 760px){

  /* this file is only loaded on /dentaldirectory, so it's safe to touch .table-style here */
  .table-style,
  .table-style .table-responsive,
  #subscribers-grid,
  #subscribers-grid .table-responsive,
  #subscribers-grid .table-responsive table.listing-table{
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  /* kill the 50% left gutter so the “card” uses full width */
  #subscribers-grid .table-responsive td{
    padding-left: 0 !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  /* keep labels above values, but remove the left-positioned label column */
  #subscribers-grid .table-responsive td:before{
    position: static !important;
    width: auto !important;
    left: auto !important;
    top: auto !important;
    padding: 0 !important;
    margin: 0 0 6px 0 !important;
    white-space: normal !important;
    display: block !important;
    text-align: center !important;
  }
}

/* 2026-02-24: /dentaldirectory mobile — force full-width “cards” after JS table->block transform */
@media only screen and (max-width: 760px){

  /* Force full width from wrapper -> table -> row -> cell */
  #subscribers-grid .table-responsive,
  #subscribers-grid .table-responsive table,
  #subscribers-grid .table-responsive thead,
  #subscribers-grid .table-responsive tbody,
  #subscribers-grid .table-responsive tr,
  #subscribers-grid .table-responsive th,
  #subscribers-grid .table-responsive td{
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Some browsers need this to avoid shrink-to-fit behavior */
  #subscribers-grid .table-responsive table{
    table-layout: fixed !important;
  }

  /* Keep the content centered, kill the 50% gutter */
  #subscribers-grid .table-responsive td{
    padding-left: 0 !important;
    text-align: center !important;
  }

  /* Labels above values (no left label column) */
  #subscribers-grid .table-responsive td:before{
    width: 100% !important;
    left: auto !important;
    top: auto !important;
    position: static !important;
    display: block !important;
    padding: 0 !important;
    margin: 0 0 6px 0 !important;
    white-space: normal !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }
}

/* 2026-02-24: /dentaldirectory — fix narrow 300px grid on mobile */
@media only screen and (max-width: 760px){
  .table-style,
  #subscribers-grid.grid-view{
    width: 100% !important;
    max-width: 100% !important;
  }

  #subscribers-grid .table-responsive,
  #subscribers-grid .listing-table{
    width: 100% !important;
    max-width: 100% !important;
  }
}