/* ==========================================================================
   Medical centre profile — ported from the supplied medical-center-profile
   template.

   Scoped to .care-center-profile, and the template's :root palette with it:
   this sheet loads on a page that already has a header, a footer and the site
   stylesheet, and the template's names (.container, .tabs, .chip, .button)
   collide with several of those. html[data-theme] became [data-bs-theme], and
   .container became .profile-container.

   The header, footer, theme toggle and back-to-top the template also shipped
   are dropped — the site's own chrome renders those.
   ========================================================================== */

.care-center-profile {
      color-scheme:light;

      --green-950:#033a2d;
      --green-900:#075b45;
      --green-850:#06684e;
      --green-800:#08755a;
      --green-700:#0a8a68;
      --green-600:#16a27c;
      --green-100:#dff4eb;
      --green-50:#f1faf6;

      --blue-900:#143e63;
      --blue-800:#1c527b;
      --blue-100:#e8f2f8;

      --gold:#c59b3b;
      --gold-soft:#f6ead0;
      --red:#b84e4e;

      --page:#f4f9f7;
      --page-soft:#edf6f2;
      --surface:rgba(255,255,255,.95);
      --surface-solid:#fff;
      --surface-muted:#f7fbf9;
      --surface-tint:#edf7f3;

      --heading:#0b3d31;
      --ink:#173d32;
      --muted:#687d76;
      --border:rgba(7,91,69,.14);
      --border-strong:rgba(7,91,69,.28);

      --shadow-xl:0 32px 80px rgba(4,65,50,.16);
      --shadow-lg:0 22px 54px rgba(4,65,50,.13);
      --shadow-md:0 14px 34px rgba(4,65,50,.10);
      --shadow-sm:0 8px 22px rgba(4,65,50,.08);

      --radius-xl:32px;
      --radius-lg:24px;
      --radius-md:18px;
      --radius-sm:14px;

      --icon:url("/images/branding/sihatuna-main-website-icon.png");
      --pattern:url("/images/patterns/sihatuna-pure-damascene-pattern.png");
    }
[data-bs-theme="dark"] .care-center-profile {
      color-scheme:dark;

      --page:#071a15;
      --page-soft:#09231b;
      --surface:rgba(12,43,34,.95);
      --surface-solid:#0e2e25;
      --surface-muted:#10372c;
      --surface-tint:#0e3027;

      --heading:#f2fbf7;
      --ink:#e5f4ed;
      --muted:#a8bbb4;
      --border:rgba(150,216,188,.14);
      --border-strong:rgba(150,216,188,.29);

      --green-100:#173f34;
      --green-50:#10352b;
      --blue-100:#102d3b;
      --gold-soft:#3f3420;

      --shadow-xl:0 36px 90px rgba(0,0,0,.46);
      --shadow-lg:0 24px 58px rgba(0,0,0,.36);
      --shadow-md:0 16px 36px rgba(0,0,0,.28);
      --shadow-sm:0 9px 24px rgba(0,0,0,.21);
    }
.care-center-profile button,
.care-center-profile input,
.care-center-profile select {font:inherit}
.care-center-profile button,
.care-center-profile a {-webkit-tap-highlight-color:transparent}
.care-center-profile a {color:inherit}
.care-center-profile img {display:block;max-width:100%}
.care-center-profile svg {display:block}
.care-center-profile button {color:inherit}
.care-center-profile .profile-container {
      width:min(1180px,calc(100% - 36px));
      margin-inline:auto;
    }
.care-center-profile .button {
      min-height:43px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:8px;
      border-radius:14px;
      text-decoration:none;
      cursor:pointer;
      transition:
        transform .16s ease,
        border-color .16s ease,
        background-color .16s ease,
        box-shadow .16s ease;
    }
.care-center-profile .button:hover {transform:translateY(-2px)}
.care-center-profile .button {
      min-height:45px;
      padding:10px 18px;
      border:1px solid transparent;
      font-weight:850;
    }
.care-center-profile .button-primary {
      color:#fff;
      background:linear-gradient(135deg,var(--green-900),var(--green-700));
      box-shadow:0 13px 28px rgba(7,91,69,.23);
    }
.care-center-profile .button-secondary {
      color:#fff;
      background:linear-gradient(135deg,#183d5d,#225d86);
      box-shadow:0 13px 28px rgba(22,63,102,.18);
    }
.care-center-profile .button-soft {
      color:var(--green-900);
      border-color:var(--border-strong);
      background:var(--surface);
    }
[data-bs-theme="dark"] .care-center-profile .button-soft {color:#b3e7d2}
/* Main profile area */
.care-center-profile .profile-section {
      padding:30px 0 86px;
    }
.care-center-profile .back-link {
      display:inline-flex;
      align-items:center;
      gap:8px;
      margin-bottom:18px;
      color:var(--green-800);
      font-size:.86rem;
      font-weight:850;
      text-decoration:none;
    }
.care-center-profile .back-link svg {
      width:17px;
      height:17px;
      stroke:currentColor;
    }
[dir="ltr"] .care-center-profile .back-link svg {transform:scaleX(-1)}
.care-center-profile .profile-card {
      position:relative;
      overflow:hidden;
      padding:24px;
      border:1px solid var(--border);
      border-radius:30px;
      background:var(--surface);
      box-shadow:var(--shadow-lg);
    }
.care-center-profile .profile-card::before {
      content:"";
      position:absolute;
      inset-inline-start:-90px;
      top:-100px;
      width:260px;
      height:260px;
      border-radius:50%;
      background:radial-gradient(circle,rgba(19,162,124,.13),transparent 69%);
      pointer-events:none;
    }
.care-center-profile .profile-grid {
      position:relative;
      display:grid;
      grid-template-columns:auto minmax(0,1fr) minmax(250px,.46fr);
      gap:22px;
      align-items:center;
    }
.care-center-profile .doctor-avatar {
      width:126px;
      height:126px;
      display:grid;
      place-items:center;
      border:7px solid rgba(255,255,255,.78);
      border-radius:34px;
      color:#fff;
      background:
        radial-gradient(circle at 32% 25%,rgba(255,255,255,.24),transparent 28%),
        linear-gradient(145deg,var(--green-800),#3b92b8);
      box-shadow:0 20px 44px rgba(6,88,67,.23);
    }
[data-bs-theme="dark"] .care-center-profile .doctor-avatar {
      border-color:rgba(255,255,255,.08);
    }
.care-center-profile .doctor-avatar svg {
      width:72px;
      height:72px;
      stroke:currentColor;
    }
.care-center-profile .doctor-identity {min-width:0}
.care-center-profile .verified-badge {
      display:inline-flex;
      align-items:center;
      gap:7px;
      min-height:29px;
      padding:6px 10px;
      border-radius:999px;
      color:#087154;
      background:var(--green-50);
      font-size:.73rem;
      font-weight:900;
    }
[data-bs-theme="dark"] .care-center-profile .verified-badge {color:#a3e5c9}
.care-center-profile .verified-badge svg {
      width:15px;
      height:15px;
      stroke:currentColor;
    }
.care-center-profile .doctor-name {
      margin:10px 0 0;
      color:var(--heading);
      font-size:clamp(1.75rem,3vw,2.45rem);
      line-height:1.08;
    }
.care-center-profile .doctor-title {
      margin:8px 0 0;
      color:var(--muted);
      font-size:1rem;
      line-height:1.6;
    }
.care-center-profile .doctor-location {
      display:flex;
      align-items:center;
      gap:7px;
      margin-top:12px;
      color:var(--muted);
      font-size:.87rem;
    }
.care-center-profile .doctor-location svg {
      width:17px;
      height:17px;
      stroke:currentColor;
    }
.care-center-profile .rating-row {
      display:flex;
      flex-wrap:wrap;
      align-items:center;
      gap:8px;
      margin-top:14px;
      color:var(--muted);
      font-size:.82rem;
    }
.care-center-profile .rating-stars {
      color:#c6972a;
      letter-spacing:1px;
    }
.care-center-profile .profile-stats {
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin-top:18px;
    }
.care-center-profile .stat-chip {
      display:inline-flex;
      align-items:center;
      gap:8px;
      min-height:38px;
      padding:8px 11px;
      border:1px solid var(--border);
      border-radius:13px;
      color:var(--muted);
      background:var(--surface-muted);
      font-size:.78rem;
      font-weight:760;
    }
.care-center-profile .stat-chip svg {
      width:17px;
      height:17px;
      stroke:var(--green-800);
    }
.care-center-profile .booking-summary {
      align-self:stretch;
      display:flex;
      flex-direction:column;
      justify-content:center;
      gap:14px;
      padding:19px;
      border:1px solid var(--border);
      border-radius:23px;
      background:
        linear-gradient(145deg,var(--surface-muted),color-mix(in srgb,var(--green-50) 45%,var(--surface-solid)));
    }
.care-center-profile .summary-top {
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap:12px;
    }
.care-center-profile .favorite-share {
      display:flex;
      gap:7px;
    }
.care-center-profile .icon-button {
      width:39px;
      height:39px;
      display:grid;
      place-items:center;
      padding:0;
      border:1px solid var(--border);
      border-radius:13px;
      color:var(--muted);
      background:var(--surface);
      cursor:pointer;
    }
.care-center-profile .icon-button:hover {color:var(--green-800)}
.care-center-profile .icon-button svg {
      width:18px;
      height:18px;
      stroke:currentColor;
    }
.care-center-profile .summary-label {
      color:var(--muted);
      font-size:.75rem;
    }
.care-center-profile .summary-fee {
      margin-top:3px;
      color:var(--gold);
      font-size:1.55rem;
      font-weight:950;
    }
.care-center-profile .next-slot {
      display:flex;
      align-items:flex-start;
      gap:9px;
      padding:11px;
      border:1px solid var(--border);
      border-radius:15px;
      background:var(--surface);
    }
.care-center-profile .next-slot svg {
      width:19px;
      height:19px;
      flex:0 0 19px;
      stroke:var(--green-800);
    }
.care-center-profile .next-slot strong {
      display:block;
      color:var(--heading);
      font-size:.85rem;
    }
.care-center-profile .next-slot span {
      display:block;
      margin-top:4px;
      color:var(--muted);
      font-size:.76rem;
    }
.care-center-profile .booking-summary .button {
      width:100%;
      min-height:50px;
    }
/* Tabs */
.care-center-profile .tabs-shell {
      position:sticky;
      top:88px;
      z-index:55;
      margin-top:18px;
      padding:7px;
      border:1px solid var(--border);
      border-radius:22px;
      background:color-mix(in srgb,var(--surface) 95%,transparent);
      box-shadow:var(--shadow-md);
      backdrop-filter:blur(16px);
      -webkit-backdrop-filter:blur(16px);
    }
.care-center-profile .tabs {
      display:flex;
      gap:4px;
      overflow-x:auto;
      overscroll-behavior-inline:contain;
      scrollbar-width:none;
    }
.care-center-profile .tabs::-webkit-scrollbar {display:none}
.care-center-profile .tab-button {
      flex:0 0 auto;
      min-height:45px;
      padding:10px 15px;
      border:0;
      border-radius:15px;
      color:var(--muted);
      background:transparent;
      font-size:.82rem;
      font-weight:850;
      white-space:nowrap;
      cursor:pointer;
    }
.care-center-profile .tab-button:hover {
      color:var(--green-800);
      background:var(--surface-muted);
    }
.care-center-profile .tab-button.is-active {
      color:#fff;
      background:linear-gradient(135deg,var(--green-900),var(--green-700));
      box-shadow:0 10px 22px rgba(7,91,69,.20);
    }
.care-center-profile .tab-panels {
      margin-top:18px;
    }
.care-center-profile .tab-panel {
      display:none;
      animation:panel-in .18s ease;
    }
.care-center-profile .tab-panel.is-active {display:block}
@keyframes panel-in {
      from{opacity:.35;transform:translateY(6px)}
      to{opacity:1;transform:none}
    }
.care-center-profile .content-card {
      padding:25px;
      border:1px solid var(--border);
      border-radius:27px;
      background:var(--surface);
      box-shadow:var(--shadow-md);
    }
.care-center-profile .content-card + .content-card {margin-top:16px}
.care-center-profile .content-heading {
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      margin-bottom:19px;
      padding-bottom:16px;
      border-bottom:1px solid var(--border);
    }
.care-center-profile .content-heading h2 {
      margin:0;
      color:var(--heading);
      font-size:1.18rem;
    }
.care-center-profile .content-heading p {
      margin:5px 0 0;
      color:var(--muted);
      font-size:.80rem;
    }
.care-center-profile .content-icon {
      width:44px;
      height:44px;
      display:grid;
      place-items:center;
      flex:0 0 44px;
      border-radius:14px;
      color:var(--green-800);
      background:var(--green-50);
    }
.care-center-profile .content-icon svg {
      width:22px;
      height:22px;
      stroke:currentColor;
    }
.care-center-profile .about-grid {
      display:grid;
      grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);
      gap:22px;
    }
.care-center-profile .about-copy {
      color:var(--muted);
      line-height:1.9;
    }
.care-center-profile .about-copy p {margin:0 0 13px}
.care-center-profile .detail-list {
      display:grid;
      gap:10px;
    }
.care-center-profile .detail-row {
      display:grid;
      grid-template-columns:40px minmax(0,1fr);
      gap:11px;
      align-items:start;
      padding:12px;
      border:1px solid var(--border);
      border-radius:15px;
      background:var(--surface-muted);
    }
.care-center-profile .detail-row svg {
      width:20px;
      height:20px;
      margin-top:2px;
      stroke:var(--green-800);
    }
.care-center-profile .detail-row small {
      display:block;
      color:var(--muted);
      font-size:.72rem;
    }
.care-center-profile .detail-row strong {
      display:block;
      margin-top:3px;
      color:var(--heading);
      font-size:.86rem;
    }
.care-center-profile .chips {
      display:flex;
      flex-wrap:wrap;
      gap:9px;
    }
.care-center-profile .chip {
      display:inline-flex;
      align-items:center;
      gap:7px;
      min-height:36px;
      padding:8px 11px;
      border:1px solid var(--border);
      border-radius:999px;
      color:var(--green-800);
      background:var(--green-50);
      font-size:.78rem;
      font-weight:850;
    }
[data-bs-theme="dark"] .care-center-profile .chip {color:#abe4ce}
.care-center-profile .clinic-grid {
      display:grid;
      gap:16px;
    }
.care-center-profile .clinic-card {
      display:grid;
      grid-template-columns:minmax(0,1fr) 310px;
      overflow:hidden;
      border:1px solid var(--border);
      border-radius:22px;
      background:var(--surface-muted);
    }
.care-center-profile .clinic-details {
      padding:20px;
    }
.care-center-profile .clinic-name {
      margin:0;
      color:var(--heading);
      font-size:1.03rem;
    }
.care-center-profile .clinic-price {
      margin-top:7px;
      color:var(--gold);
      font-size:.93rem;
      font-weight:900;
    }
.care-center-profile .clinic-meta {
      display:grid;
      gap:8px;
      margin-top:14px;
      color:var(--muted);
      font-size:.82rem;
    }
.care-center-profile .clinic-meta span {
      display:flex;
      align-items:flex-start;
      gap:8px;
    }
.care-center-profile .clinic-meta svg {
      width:17px;
      height:17px;
      flex:0 0 17px;
      stroke:currentColor;
    }
.care-center-profile .clinic-actions {
      display:flex;
      flex-wrap:wrap;
      gap:9px;
      margin-top:16px;
    }
/* The published profile links, under the contact actions. */
.care-center-profile .clinic-social {
      margin-top:16px;
      padding-top:14px;
      border-top:1px solid var(--border);
    }
.care-center-profile .clinic-social-label {
      display:block;
      color:var(--muted);
      font-size:.72rem;
      font-weight:850;
      text-transform:uppercase;
      letter-spacing:.05em;
    }
.care-center-profile .clinic-social .clinic-actions {
      margin-top:9px;
    }
.care-center-profile .small-button {
      min-height:40px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:7px;
      padding:9px 13px;
      border:1px solid var(--border-strong);
      border-radius:13px;
      color:var(--green-900);
      background:var(--surface);
      font-size:.78rem;
      font-weight:900;
      text-decoration:none;
    }
[data-bs-theme="dark"] .care-center-profile .small-button {color:#afe6d0}
.care-center-profile .small-button.primary {
      color:#fff;
      border-color:transparent;
      background:linear-gradient(135deg,var(--green-900),var(--green-700));
    }
.care-center-profile .small-button svg {
      width:16px;
      height:16px;
      stroke:currentColor;
    }
.care-center-profile .map-card {
      position:relative;
      min-height:230px;
      overflow:hidden;
      border-inline-start:1px solid var(--border);
      background:
        linear-gradient(135deg,rgba(223,243,235,.72),rgba(220,237,246,.86));
    }
[data-bs-theme="dark"] .care-center-profile .map-card {
      background:linear-gradient(135deg,rgba(16,62,49,.85),rgba(15,52,65,.82));
    }
.care-center-profile .map-card::before {
      content:"";
      position:absolute;
      inset:0;
      opacity:.18;
      background-image:
        linear-gradient(90deg,transparent 48%,rgba(7,91,69,.18) 49%,rgba(7,91,69,.18) 51%,transparent 52%),
        linear-gradient(0deg,transparent 48%,rgba(7,91,69,.18) 49%,rgba(7,91,69,.18) 51%,transparent 52%);
      background-size:58px 58px;
    }
.care-center-profile .map-pin {
      position:absolute;
      inset:50% auto auto 50%;
      width:56px;
      height:56px;
      display:grid;
      place-items:center;
      border:5px solid rgba(255,255,255,.76);
      border-radius:50% 50% 50% 15px;
      color:#fff;
      background:var(--green-800);
      box-shadow:0 16px 36px rgba(5,92,71,.24);
      transform:translate(-50%,-60%) rotate(-45deg);
    }
.care-center-profile .map-pin svg {
      width:23px;
      height:23px;
      stroke:currentColor;
      transform:rotate(45deg);
    }
.care-center-profile .center-card {
      display:grid;
      grid-template-columns:72px minmax(0,1fr) auto;
      gap:16px;
      align-items:center;
      padding:18px;
      border:1px solid var(--border);
      border-radius:20px;
      background:var(--surface-muted);
    }
.care-center-profile .center-icon {
      width:72px;
      height:72px;
      display:grid;
      place-items:center;
      border-radius:22px;
      color:#fff;
      background:linear-gradient(145deg,var(--green-800),#3d94bb);
    }
.care-center-profile .center-icon svg {
      width:38px;
      height:38px;
      stroke:currentColor;
    }
.care-center-profile .center-card h3 {
      margin:0;
      color:var(--heading);
      font-size:.98rem;
    }
.care-center-profile .center-card p {
      margin:6px 0 0;
      color:var(--muted);
      font-size:.80rem;
      line-height:1.55;
    }
.care-center-profile .center-card + .center-card {margin-top:12px}
.care-center-profile .service-list {
      display:grid;
      gap:11px;
    }
.care-center-profile .service-row {
      display:grid;
      grid-template-columns:44px minmax(0,1fr) auto;
      gap:13px;
      align-items:center;
      padding:13px;
      border:1px solid var(--border);
      border-radius:17px;
      background:var(--surface-muted);
    }
.care-center-profile .service-icon {
      width:44px;
      height:44px;
      display:grid;
      place-items:center;
      border-radius:14px;
      color:var(--green-800);
      background:var(--green-50);
    }
.care-center-profile .service-icon svg {
      width:22px;
      height:22px;
      stroke:currentColor;
    }
.care-center-profile .service-row strong {
      display:block;
      color:var(--heading);
      font-size:.88rem;
    }
.care-center-profile .service-row span {
      display:block;
      margin-top:4px;
      color:var(--muted);
      font-size:.74rem;
    }
.care-center-profile .service-price {
      color:var(--gold);
      font-size:.94rem;
      font-weight:950;
      white-space:nowrap;
    }
.care-center-profile .availability-layout {
      display:grid;
      grid-template-columns:220px minmax(0,1fr);
      gap:19px;
    }
.care-center-profile .date-list {
      display:grid;
      gap:8px;
    }
.care-center-profile .date-button {
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      min-height:58px;
      padding:10px 12px;
      border:1px solid var(--border);
      border-radius:15px;
      color:var(--muted);
      background:var(--surface-muted);
      cursor:pointer;
      text-align:inherit;
    }
.care-center-profile .date-button strong {
      display:block;
      color:var(--heading);
      font-size:.83rem;
    }
.care-center-profile .date-button small {
      display:block;
      margin-top:3px;
      font-size:.70rem;
    }
.care-center-profile .date-button.is-active {
      color:#fff;
      border-color:transparent;
      background:linear-gradient(135deg,var(--green-900),var(--green-700));
    }
.care-center-profile .date-button.is-active strong,
.care-center-profile .date-button.is-active small {color:#fff}
.care-center-profile .date-count {
      min-width:26px;
      height:26px;
      display:grid;
      place-items:center;
      border-radius:999px;
      color:var(--green-800);
      background:var(--surface);
      font-size:.68rem;
      font-weight:900;
    }
.care-center-profile .slots-panel {
      min-width:0;
      padding:15px;
      border:1px solid var(--border);
      border-radius:19px;
      background:var(--surface-muted);
    }
.care-center-profile .slots-title {
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:14px;
      margin-bottom:13px;
    }
.care-center-profile .slots-title strong {
      color:var(--heading);
      font-size:.88rem;
    }
.care-center-profile .slots-title span {
      color:var(--muted);
      font-size:.73rem;
    }
.care-center-profile .time-slots {
      display:grid;
      grid-template-columns:repeat(4,minmax(0,1fr));
      gap:9px;
    }
.care-center-profile .time-slot {
      min-height:50px;
      padding:8px 7px;
      border:1px solid var(--border);
      border-radius:13px;
      color:var(--heading);
      background:var(--surface);
      font-size:.80rem;
      font-weight:850;
      cursor:pointer;
    }
.care-center-profile .time-slot:hover {
      border-color:var(--border-strong);
      color:var(--green-800);
    }
.care-center-profile .time-slot.is-selected {
      color:#fff;
      border-color:transparent;
      background:linear-gradient(135deg,var(--green-900),var(--green-700));
    }
.care-center-profile .slot-confirm {
      display:none;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      margin-top:14px;
      padding:12px;
      border:1px solid var(--border);
      border-radius:15px;
      background:var(--surface);
    }
.care-center-profile .slot-confirm.is-visible {display:flex}
.care-center-profile .slot-confirm strong {
      display:block;
      color:var(--heading);
      font-size:.82rem;
    }
.care-center-profile .slot-confirm span {
      display:block;
      margin-top:3px;
      color:var(--muted);
      font-size:.73rem;
    }
.care-center-profile .hours-list {
      display:grid;
      gap:6px;
    }
.care-center-profile .hours-row {
      display:grid;
      grid-template-columns:minmax(0,1fr) auto;
      gap:14px;
      align-items:center;
      padding:12px 13px;
      border-radius:14px;
      color:var(--muted);
    }
.care-center-profile .hours-row:nth-child(even) {background:var(--surface-muted)}
.care-center-profile .hours-row.is-today {
      color:var(--heading);
      background:var(--blue-100);
    }
.care-center-profile .hours-day {
      display:flex;
      align-items:center;
      gap:9px;
      color:var(--heading);
      font-weight:850;
    }
.care-center-profile .today-badge {
      padding:4px 8px;
      border-radius:999px;
      color:#fff;
      background:var(--green-800);
      font-size:.66rem;
      font-weight:900;
    }
.care-center-profile .closed {color:#9a7474}
.care-center-profile .timeline {
      position:relative;
      display:grid;
      gap:18px;
      padding-inline-start:28px;
    }
[dir="ltr"] .care-center-profile .timeline {padding-inline-start:28px}
.care-center-profile .timeline::before {
      content:"";
      position:absolute;
      inset-block:8px;
      inset-inline-start:9px;
      width:2px;
      background:var(--border-strong);
    }
.care-center-profile .timeline-item {
      position:relative;
      padding:16px;
      border:1px solid var(--border);
      border-radius:18px;
      background:var(--surface-muted);
    }
.care-center-profile .timeline-item::before {
      content:"";
      position:absolute;
      top:20px;
      inset-inline-start:-25px;
      width:14px;
      height:14px;
      border:4px solid var(--surface);
      border-radius:50%;
      background:var(--green-800);
      box-shadow:0 0 0 1px var(--border-strong);
    }
.care-center-profile .timeline-item h3 {
      margin:0;
      color:var(--heading);
      font-size:.93rem;
    }
.care-center-profile .timeline-item .place {
      margin-top:5px;
      color:var(--green-800);
      font-size:.78rem;
      font-weight:850;
    }
.care-center-profile .timeline-item .period {
      margin-top:6px;
      color:var(--muted);
      font-size:.73rem;
    }
.care-center-profile .timeline-item p {
      margin:10px 0 0;
      color:var(--muted);
      font-size:.80rem;
      line-height:1.65;
    }
.care-center-profile .empty-state {
      display:grid;
      place-items:center;
      min-height:210px;
      padding:25px;
      text-align:center;
      border:1px dashed var(--border-strong);
      border-radius:20px;
      background:var(--surface-muted);
    }
.care-center-profile .empty-state svg {
      width:48px;
      height:48px;
      stroke:var(--green-800);
    }
.care-center-profile .empty-state h3 {
      margin:13px 0 0;
      color:var(--heading);
      font-size:1rem;
    }
.care-center-profile .empty-state p {
      max-width:520px;
      margin:7px auto 0;
      color:var(--muted);
      font-size:.80rem;
      line-height:1.65;
    }
.care-center-profile .mobile-booking-bar {display:none}
.care-center-profile a:focus-visible,
.care-center-profile button:focus-visible,
.care-center-profile input:focus-visible,
.care-center-profile select:focus-visible {
      outline:3px solid rgba(33,153,112,.34);
      outline-offset:3px;
    }
@media(max-width:1100px) {
  .care-center-profile .profile-grid {
        grid-template-columns:auto minmax(0,1fr);
      }
  .care-center-profile .booking-summary {
        grid-column:1 / -1;
        display:grid;
        grid-template-columns:1fr 1fr;
        align-items:center;
      }
  .care-center-profile .summary-top {align-self:center}
  .care-center-profile .next-slot {align-self:center}
  .care-center-profile .booking-summary .button {grid-column:1 / -1}
  .care-center-profile .about-grid {grid-template-columns:1fr}
  .care-center-profile .clinic-card {grid-template-columns:1fr}
  .care-center-profile .map-card {border-inline-start:0;border-top:1px solid var(--border)}
  .care-center-profile .availability-layout {grid-template-columns:1fr}
  .care-center-profile .date-list {grid-template-columns:repeat(5,minmax(120px,1fr));overflow-x:auto}
}
@media(max-width:780px) {
  .care-center-profile .profile-section {padding-top:22px}
  .care-center-profile .profile-card {padding:18px;border-radius:25px}
  .care-center-profile .profile-grid {
        grid-template-columns:1fr;
        text-align:center;
      }
  .care-center-profile .doctor-avatar {margin-inline:auto}
  .care-center-profile .doctor-location,
.care-center-profile .rating-row,
.care-center-profile .profile-stats {justify-content:center}
  .care-center-profile .booking-summary {
        grid-template-columns:1fr;
        text-align:start;
      }
  .care-center-profile .booking-summary .button {grid-column:auto}
  .care-center-profile .tabs-shell {
        top:78px;
        border-radius:18px;
      }
  .care-center-profile .content-card {
        padding:19px;
        border-radius:22px;
      }
  .care-center-profile .clinic-card {grid-template-columns:1fr}
  .care-center-profile .center-card {grid-template-columns:64px minmax(0,1fr)}
  .care-center-profile .center-card .small-button {grid-column:1 / -1}
  .care-center-profile .center-icon {width:64px;height:64px}
  .care-center-profile .service-row {grid-template-columns:40px minmax(0,1fr)}
  .care-center-profile .service-price {grid-column:2}
  .care-center-profile .time-slots {grid-template-columns:repeat(3,minmax(0,1fr))}
  .care-center-profile .slot-confirm {align-items:stretch;flex-direction:column}
}
@media(max-width:620px) {
  .care-center-profile .profile-container {width:min(100% - 24px,1180px)}
  .care-center-profile .profile-section {padding-bottom:54px}
  .care-center-profile .doctor-avatar {width:110px;height:110px}
  .care-center-profile .doctor-avatar svg {width:62px;height:62px}
  .care-center-profile .doctor-name {font-size:1.75rem}
  .care-center-profile .profile-stats {display:grid;grid-template-columns:1fr 1fr;width:100%}
  .care-center-profile .stat-chip {justify-content:center}
  .care-center-profile .favorite-share {margin-inline-start:auto}
  .care-center-profile .tabs-shell {
        margin-inline:-2px;
        padding:5px;
      }
  .care-center-profile .tab-button {
        min-height:42px;
        padding:9px 12px;
        font-size:.77rem;
      }
  .care-center-profile .content-heading {
        align-items:flex-start;
      }
  .care-center-profile .clinic-details {padding:16px}
  .care-center-profile .clinic-actions {display:grid;grid-template-columns:1fr}
  .care-center-profile .center-card {grid-template-columns:1fr;text-align:center}
  .care-center-profile .center-icon {margin-inline:auto}
  .care-center-profile .service-row {grid-template-columns:38px minmax(0,1fr)}
  .care-center-profile .time-slots {grid-template-columns:repeat(2,minmax(0,1fr))}
  .care-center-profile .date-list {grid-template-columns:repeat(5,128px)}
  .care-center-profile .hours-row {padding:11px 9px}
  .care-center-profile .mobile-booking-bar {
        position:fixed;
        inset-inline:0;
        bottom:0;
        z-index:100;
        display:grid;
        grid-template-columns:1fr auto;
        gap:10px;
        align-items:center;
        padding:10px 12px;
        border-top:1px solid var(--border);
        background:color-mix(in srgb,var(--surface) 96%,transparent);
        box-shadow:0 -12px 32px rgba(3,58,45,.16);
        backdrop-filter:blur(16px);
        -webkit-backdrop-filter:blur(16px);
      }
  .care-center-profile .mobile-booking-bar small {
        display:block;
        color:var(--muted);
        font-size:.68rem;
      }
  .care-center-profile .mobile-booking-bar strong {
        display:block;
        margin-top:2px;
        color:var(--gold);
        font-size:1rem;
      }
  .care-center-profile .mobile-booking-bar .button {
        min-height:46px;
        padding-inline:16px;
      }
}
/* Medical-center profile additions: shared with the doctor-profile design system */
.care-center-profile .mc-avatar {
      width:126px;height:126px;display:grid;place-items:center;
      border:7px solid rgba(255,255,255,.78);border-radius:34px;color:#fff;
      background:radial-gradient(circle at 32% 25%,rgba(255,255,255,.24),transparent 28%),linear-gradient(145deg,var(--green-800),#3b92b8);
      box-shadow:0 20px 44px rgba(6,88,67,.23)
    }
[data-bs-theme="dark"] .care-center-profile .mc-avatar {border-color:rgba(255,255,255,.08)}
.care-center-profile .mc-avatar svg {width:72px;height:72px;stroke:currentColor}
.care-center-profile .mc-open-card {display:flex;align-items:flex-start;gap:9px;padding:11px;border:1px solid var(--border);border-radius:15px;background:var(--surface)}
.care-center-profile .mc-open-dot {width:10px;height:10px;flex:0 0 10px;margin-top:5px;border-radius:50%;background:#18a970;box-shadow:0 0 0 4px rgba(24,169,112,.12)}
.care-center-profile .mc-open-card strong {display:block;color:var(--green-800);font-size:.85rem}
.care-center-profile .mc-open-card small {display:block;margin-top:4px;color:var(--muted);font-size:.76rem}
.care-center-profile .mc-highlight-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.care-center-profile .mc-highlight {min-height:126px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:17px;border:1px solid var(--border);border-radius:19px;text-align:center;background:var(--surface-muted)}
.care-center-profile .mc-highlight strong {color:var(--green-800);font-size:1.75rem;line-height:1}
.care-center-profile .mc-highlight span {margin-top:8px;color:var(--muted);font-size:.78rem;line-height:1.45}
.care-center-profile .mc-doctor-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.care-center-profile .mc-doctor-card {display:grid;grid-template-columns:76px minmax(0,1fr);gap:14px;align-items:center;padding:17px;border:1px solid var(--border);border-radius:20px;background:var(--surface-muted)}
.care-center-profile .mc-doctor-avatar {width:76px;height:76px;display:grid;place-items:center;border-radius:22px;color:#fff;background:linear-gradient(145deg,var(--green-800),#398fb4);font-size:1.05rem;font-weight:950}
.care-center-profile .mc-doctor-specialty {color:var(--green-800);font-size:.72rem;font-weight:900}
.care-center-profile .mc-doctor-card h3 {margin:5px 0 0;color:var(--heading);font-size:.95rem}
.care-center-profile .mc-doctor-card p {margin:5px 0 0;color:var(--muted);font-size:.76rem}
.care-center-profile .mc-doctor-actions {display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.care-center-profile .mc-equipment-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.care-center-profile .mc-equipment-card {padding:18px;border:1px solid var(--border);border-radius:20px;background:var(--surface-muted)}
.care-center-profile .mc-equipment-icon {width:48px;height:48px;display:grid;place-items:center;border-radius:15px;color:var(--green-800);background:var(--green-50)}
.care-center-profile .mc-equipment-icon svg {width:24px;height:24px;stroke:currentColor}
.care-center-profile .mc-equipment-card h3 {margin:14px 0 0;color:var(--heading);font-size:.92rem}
.care-center-profile .mc-equipment-card p {margin:7px 0 0;color:var(--muted);font-size:.78rem;line-height:1.6}
.care-center-profile .mc-review-summary {display:grid;grid-template-columns:180px minmax(0,1fr);gap:24px;align-items:center;padding:18px;border:1px solid var(--border);border-radius:20px;background:var(--surface-muted)}
.care-center-profile .mc-review-score {display:grid;justify-items:center;gap:6px;text-align:center}
.care-center-profile .mc-review-score strong {color:var(--heading);font-size:2.5rem;line-height:1}
.care-center-profile .mc-review-score small {color:var(--muted)}
.care-center-profile .mc-rating-bars {display:grid;gap:8px}
.care-center-profile .mc-rating-bars>div {display:grid;grid-template-columns:16px minmax(0,1fr) 38px;gap:9px;align-items:center;color:var(--muted);font-size:.74rem}
.care-center-profile .mc-rating-bars i {height:8px;overflow:hidden;border-radius:999px;background:var(--border)}
.care-center-profile .mc-rating-bars b {display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--gold),#dfbc5e)}
.care-center-profile .mc-review-list {display:grid;gap:12px;margin-top:18px}
.care-center-profile .mc-review {padding:17px;border:1px solid var(--border);border-radius:18px;background:var(--surface-muted)}
.care-center-profile .mc-review-head {display:flex;justify-content:space-between;gap:12px;align-items:center}
.care-center-profile .mc-review-head strong {color:var(--heading)}
.care-center-profile .mc-review p {margin:10px 0 0;color:var(--muted);font-size:.80rem;line-height:1.7}
.care-center-profile .mc-review small {display:block;margin-top:8px;color:var(--muted);font-size:.72rem}
.care-center-profile .review-login-note {display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:18px;padding:15px;border:1px solid var(--border);border-radius:17px;background:var(--surface-muted)}
.care-center-profile .review-login-note strong {display:block;color:var(--heading);font-size:.85rem}
.care-center-profile .review-login-note small {display:block;margin-top:4px;color:var(--muted);font-size:.75rem}
@media(max-width:900px) {
  .care-center-profile .mc-highlight-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
  .care-center-profile .mc-doctor-grid,
.care-center-profile .mc-equipment-grid {grid-template-columns:1fr}
}
@media(max-width:620px) {
  .care-center-profile .mc-avatar {width:110px;height:110px;margin-inline:auto}
  .care-center-profile .mc-avatar svg {width:62px;height:62px}
  .care-center-profile .mc-highlight-grid {grid-template-columns:1fr 1fr}
  .care-center-profile .mc-doctor-card {grid-template-columns:64px minmax(0,1fr)}
  .care-center-profile .mc-doctor-avatar {width:64px;height:64px}
  .care-center-profile .mc-review-summary {grid-template-columns:1fr}
  .care-center-profile .review-login-note {align-items:stretch;flex-direction:column}
}

/* ==========================================================================
   Additions on top of the template.
   ========================================================================== */

/* The template ships one day's times and swaps them in script. Every day is
   rendered here instead, so the times survive with scripting off; this is what
   hides the ones the reader has not asked for. */
.care-center-profile .slots-day.is-hidden {
    display: none;
}

/* A fact the profile cannot answer yet still keeps its row, so the card holds
   its shape — but it says so rather than showing an invented number. */
.care-center-profile .fact-pending {
    color: var(--muted);
    font-style: italic;
    font-weight: 600;
    opacity: .75;
}

/* Slots belong to one service, and the panel says which. */
.care-center-profile .slots-service {
    margin: 0 0 14px;
    color: var(--muted);
    font-size: .82rem;
    font-weight: 700;
}

/* A real logo when the organization has uploaded one, the template's building
   glyph when it has not. */
.care-center-profile .mc-avatar {
    overflow: hidden;
}

.care-center-profile .mc-avatar-logo {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* The template's dot is always the open green. Closed is a real state here. */
.care-center-profile .mc-open-card.is-closed .mc-open-dot {
    background: var(--red);
    box-shadow: 0 0 0 4px rgba(184, 78, 78, .12);
}

.care-center-profile .mc-open-card.is-closed strong {
    color: var(--red);
}

/* The favourite heart is a form button, so the form must not take part in the
   row's layout — otherwise the two icons stop sitting side by side. */
.care-center-profile .favorite-share form {
    display: contents;
}

.care-center-profile .icon-button.is-on {
    border-color: rgba(184, 78, 78, .4);
    color: var(--red);
}

.care-center-profile .icon-button.is-on svg {
    fill: currentColor;
}

/* Doctor cards carry initials, or a photograph over them. */
.care-center-profile .mc-doctor-avatar {
    position: relative;
    overflow: hidden;
}

.care-center-profile .mc-doctor-photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
}

/* Slots are links, not buttons: each one is a real booking URL, so it can be
   opened in a new tab and survives with scripting off. */
.care-center-profile a.time-slot {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

/* Each service row books itself, so the price column carries the button. */
.care-center-profile .service-price {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* The template's map panel is decorative. Ours is the directions link, so it
   has to behave like one. */
.care-center-profile a.map-card {
    display: block;
    text-decoration: none;
}

/* Photographs the place has published. The template's centre had none, so this
   grid is ours — built from its card and radius language. */
.care-center-profile .mc-photo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 12px;
}

.care-center-profile .mc-photo {
    margin: 0;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 17px;
    background: var(--surface-muted);
}

.care-center-profile .mc-photo img {
    display: block;
    width: 100%;
    height: 160px;
    object-fit: cover;
}

.care-center-profile .mc-photo figcaption {
    padding: 9px 11px;
    color: var(--muted);
    font-size: .78rem;
}

.care-center-profile .mc-review-form-heading {
    margin: 22px 0 12px;
    color: var(--heading);
    font-size: 1rem;
}

/* Every tab on screen at once.

   The template's strip scrolls horizontally, which is right on a phone but on a
   wide screen it just hides the last tab behind an edge with no hint it is
   there. Given room, the tabs share it evenly and every one is reachable
   without scrolling; below that the template's scroller takes over unchanged. */
@media (min-width: 1000px) {
    .care-center-profile .tabs {
        overflow-x: visible;
    }

    .care-center-profile .tab-button {
        flex: 1 1 auto;
        min-width: 0;
        padding-inline: 10px;
        text-align: center;
    }
}

/* The rail is as long as the centre has open days. The template sized it for
   exactly five, so a sixth and seventh wrapped onto a second row; this lets any
   number of them scroll along one line instead. */
@media (max-width: 1100px) {
    .care-center-profile .date-list {
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: minmax(120px, 1fr);
        overflow-x: auto;
    }
}

@media (max-width: 620px) {
    .care-center-profile .date-list {
        grid-auto-columns: 128px;
    }
}

/* The template bleeds the tab strip 2px past its container on a phone. Two pixels
   of nothing is still two pixels the page can be dragged sideways by, so the strip
   stays inside its column and the scroll it needs stays the one inside itself. */
@media (max-width: 620px) {
    .care-center-profile .tabs-shell {
        margin-inline: 0;
    }
}

/* The template narrows the gutter on a phone. */
@media (max-width: 620px) {
    .care-center-profile .profile-container {
        width: min(100% - 24px, 1180px);
    }
}

/* "Not published yet" is a sentence, not a price, so it does not take the
   price's display size — at 1.5rem it wrapped over three lines in the summary. */
.care-center-profile .summary-fee.fact-pending {
    font-size: .95rem;
    font-weight: 700;
}

/* Dark mode: the green the template writes text and icons in.

   --green-800 is a foreground here — headings on the open card, the highlight
   figures, the back link, every content icon's stroke — and the dark palette
   leaves it at its light-mode value, which lands at roughly 2.3:1 on a dark
   card. The template already lightens .chip and .verified-badge this way and
   simply missed the rest; this finishes the job with the same mint. */
[data-bs-theme="dark"] .care-center-profile .back-link,
[data-bs-theme="dark"] .care-center-profile .icon-button:hover,
[data-bs-theme="dark"] .care-center-profile .tab-button:hover,
[data-bs-theme="dark"] .care-center-profile .content-icon,
[data-bs-theme="dark"] .care-center-profile .chip,
[data-bs-theme="dark"] .care-center-profile .clinic-price,
[data-bs-theme="dark"] .care-center-profile .service-icon,
[data-bs-theme="dark"] .care-center-profile .date-count,
[data-bs-theme="dark"] .care-center-profile .time-slot:hover,
[data-bs-theme="dark"] .care-center-profile .timeline-item .place,
[data-bs-theme="dark"] .care-center-profile .mc-open-card strong,
[data-bs-theme="dark"] .care-center-profile .mc-highlight strong,
[data-bs-theme="dark"] .care-center-profile .mc-doctor-specialty,
[data-bs-theme="dark"] .care-center-profile .mc-equipment-icon {
    color: #a3e5c9;
}

/* The template's muted grey-green reads 4.21:1 on the card tint — just under the
   4.5:1 that secondary text needs to stay legible. Darkened by a hair; it is still
   plainly the quiet colour beside the headings, and now it is readable. */
.care-center-profile {
    --muted: #616f6a;
}

/* "Closed" is a fact a reader needs, and the template greys it to 4.1:1 in light
   and 3.7:1 in dark — under the 4.5:1 that ordinary text needs. Same muted red,
   dark enough on a light card and light enough on a dark one. */
.care-center-profile .closed {
    color: #ad4040;
}

[data-bs-theme="dark"] .care-center-profile .closed {
    color: #e08a8a;
}

/* The organization's public answer under a review: indented, bordered on the
   inline-start like quoted speech, and labelled — never mistakable for the
   patient's own words. */
.mc-review-reply {
    margin: 10px 0 0;
    padding: 10px 14px;
    border-inline-start: 3px solid var(--sihatuna-gold, #c49a37);
    background: var(--sihatuna-gold-soft, #f6eed9);
    border-radius: 10px;
}

.mc-review-reply strong {
    display: block;
    font-size: .8rem;
    margin-block-end: 4px;
}

.mc-review-reply p {
    margin: 0;
    line-height: 1.6;
}

[data-bs-theme="dark"] .mc-review-reply {
    background: rgba(138, 106, 28, .18);
}

/* Other locations under the head address: one card per branch, its own pin,
   the same directions link every location gets. */
.org-branches h3 {
    margin: 0 0 10px;
    font-size: 1rem;
}

.org-branch-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 14px;
}

.org-branch {
    display: grid;
    gap: 10px;
    padding-block-start: 12px;
    border-block-start: 1px solid var(--line, #e2ece7);
}

.org-branch-text {
    display: grid;
    gap: 4px;
    line-height: 1.55;
}

.org-branch-map {
    min-block-size: 180px;
}

/* Whether this door is open at this moment: the word carries the state, the
   colour only underlines it. */
.org-branch-state {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--ok, #1c7c54);
}

.org-branch-state.is-closed {
    color: var(--muted, #6b7a75);
}

.org-branch-state small {
    font-weight: 400;
}