/*
 * MVN / Muslim Professional Network — Editorial Service, 22 October 2026.
 * Deliberately scoped presentation layer: no data, permission, or booking logic changes.
 * Enhances the existing Laravel views and retains English/RTL, dark mode and reduced motion.
 */

/* PUBLIC — TYPOGRAPHIC, PHOTO-FREE SERVICE STORYBOARD */
body.mvn-public-v2.mvn-humanized.mp-refined-v2 .mvn-public-hero-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.04fr) minmax(335px, .84fr) !important;
  align-items: center !important;
  gap: clamp(38px, 5.5vw, 88px) !important;
  max-width: 1280px !important;
}
body.mvn-public-v2.mvn-humanized.mp-refined-v2 .mvn-public-hero-copy { min-width:0; max-width:740px; }
html[lang="en"] body.mvn-public-v2.mvn-humanized.mp-refined-v2 .mvn-public-hero-copy h1 {
  max-width:710px !important;
  font-size:clamp(42px,4.6vw,67px) !important;
  letter-spacing:-.047em !important;
}
body.mvn-public-v2.mp-refined-v2 .mp-service-panel {
  --mp-pine:#173f32;
  position:relative;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  min-height:490px;
  padding:clamp(25px,2.9vw,40px);
  border:1px solid #2c5143;
  border-radius:12px;
  background:#173f32;
  color:#f7f6f0;
  box-shadow:0 18px 50px rgba(13,46,35,.08) !important;
}
body.mvn-public-v2.mp-refined-v2 .mp-service-panel::before {
  content:"";
  position:absolute;
  inset:-120px -105px auto auto;
  width:405px;
  height:405px;
  border:1px solid rgba(224,223,185,.25);
  border-radius:50%;
  pointer-events:none;
  z-index:-1;
}
body.mvn-public-v2.mp-refined-v2 .mp-service-panel::after {
  content:"";
  position:absolute;
  inset:-82px -70px auto auto;
  width:320px;
  height:320px;
  border:1px solid rgba(224,223,185,.17);
  border-radius:50%;
  pointer-events:none;
  z-index:-1;
}
.mp-service-panel-top {display:flex;justify-content:space-between;gap:15px;align-items:center;}
.mp-service-panel-top span:first-child {font-size:11px;font-weight:720;letter-spacing:.13em;text-transform:uppercase;color:#d9d2ac;}
.mp-service-panel-top span:last-child {font-family:Georgia,Cambria,serif;font-size:14px;color:#ede9cf;white-space:nowrap;}
.mp-service-panel-art {height:120px;display:flex;align-items:center;justify-content:center;position:relative;margin:13px 0 4px;}
.mp-service-panel-art::before {content:"";position:absolute;width:105px;height:105px;border:1px solid rgba(225,211,162,.45);transform:rotate(45deg);border-radius:7px;}
.mp-service-panel-art::after {content:"";position:absolute;width:96px;height:96px;border:1px solid rgba(225,211,162,.3);border-radius:50%;}
.mp-service-panel-art svg {display:block;position:relative;z-index:2;width:64px;height:64px;color:#d8be83;fill:none;max-width:100%;}
.mp-service-panel-caption {display:block;margin-bottom:9px;color:#dcc69b;font-size:10px;font-weight:760;letter-spacing:.15em;text-transform:uppercase;}
body.mvn-public-v2.mp-refined-v2 .mp-service-panel h2 {
  font-family:Georgia,"Iowan Old Style",Cambria,serif;
  font-size:clamp(27px,2.5vw,37px);
  line-height:1.14;
  letter-spacing:-.035em;
  font-weight:500;
  color:#f7f6f0;
  max-width:15ch;
  margin:0 0 18px;
}
.mp-service-panel ol {padding:0;margin:auto 0 0;list-style:none;display:grid;border-top:1px solid rgba(237,239,219,.23);}
.mp-service-panel li {display:grid;grid-template-columns:38px minmax(0,1fr) 20px;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid rgba(237,239,219,.23);}
.mp-service-panel li span {font-family:Georgia,Cambria,serif;font-size:15px;color:#d8be83;}
.mp-service-panel li strong {font-size:13px;font-weight:600;color:#f0f2e9;line-height:1.4;}
.mp-service-panel li::after {content:"↗";font-size:15px;color:#cfcaad;opacity:.75;text-align:end;}
body.mvn-public-v2.mp-refined-v2 .mvn-public-hero-actions a {min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:8px;}
body.mvn-public-v2.mp-refined-v2 :is(.mvn-public-primary,.mvn-public-secondary,.mvn-public-signin,.mvn-public-apply):focus-visible {
  outline:3px solid #b69661 !important;outline-offset:3px;
}
body.mvn-public-v2.mp-refined-v2 .mvn-public-section-head h2 {text-wrap:balance;}
body.mvn-public-v2.mp-refined-v2 .mvn-public-form-card :is(input,select,textarea,button) {max-width:100%;}
body.mvn-public-v2.mp-refined-v2 .mvn-public-form-card :is(input,select,textarea):focus-visible {outline:3px solid #b69661;outline-offset:2px;}

/* WORKSPACE — LESS REPETITION, STRONGER NEXT ACTIONS */
body.mvn-ui-v3 .mvn-admin5-head {
  padding:clamp(15px,2.6vw,27px) clamp(16px,2.6vw,30px) !important;
  border:1px solid #d9e2d8 !important;
  border-radius:12px !important;
  background:#f7f8f4 !important;
  align-items:center !important;
}
body.mvn-ui-v3 .mvn-admin5-head h1 {font-size:clamp(27px,2.9vw,39px);line-height:1.16;text-wrap:balance;}
body.mvn-ui-v3 .mvn-admin5-head-actions {max-width:440px;}
body.mvn-ui-v3 .mvn-admin5-kpis {border-radius:10px !important;}
body.mvn-ui-v3 .mvn-admin5-kpis article {min-width:0;}
body.mvn-ui-v3 .mvn-admin5-kpis strong {font-variant-numeric:tabular-nums;letter-spacing:-.045em;}
body.mvn-ui-v3 .mvn-admin5-attention {border-inline-start:3px solid #c19d58 !important;}
body.mvn-ui-v3 .mvn-admin5-task-list a {min-height:53px;}
body.mvn-ui-v3 .mvn-admin5-task-list a:hover {background:rgba(36,109,78,.05);}
body.mvn-ui-v3 .mvn-myday-hero {border-radius:12px !important;background:#f7f8f4 !important;border-color:#d9e2d8 !important;box-shadow:none !important;}
body.mvn-ui-v3 .mvn-myday-action {
  border-inline-start:3px solid #c09a58 !important;
  background:#fffef9 !important;
  box-shadow:none !important;
  border-radius:9px !important;
}
body.mvn-ui-v3 .mvn-myday-action strong {line-height:1.35;overflow-wrap:anywhere;}
body.mvn-ui-v3 .mvn-myday-action .btn {min-height:42px;}
body.mvn-ui-v3 .mvn-myday-metrics {border-radius:10px !important;overflow:hidden;}
body.mvn-ui-v3 .mvn-myday-main > *,body.mvn-ui-v3 .mvn-myday-stack > *,body.mvn-ui-v3 .mvn-admin5-grid > * {min-width:0;}
body.mvn-ui-v3 :is(.mvn-admin5-card,.mvn-myday-section,.mvn-journey-dashboard-card,.mvn-impact-dashboard-card) {box-shadow:none !important;}
body.mvn-ui-v3 :is(.mvn-admin5,.mvn-myday) :is(a,button,input,select,textarea):focus-visible {
  outline:3px solid #b78c47 !important;outline-offset:2px;
}

/* CALENDAR — EXPLICIT MONTH/AGENDA CHOICE, TIMEZONE AND FILTER DISCLOSURE */
body.mvn-ui-v3 .mvn-calendar-shell {gap:17px;}
body.mvn-ui-v3 .mvn-calendar-hero {align-items:center;border-bottom-color:#dde5dd;}
body.mvn-ui-v3 .mvn-calendar-hero h1 {text-wrap:balance;}
body.mvn-ui-v3 .mp-calendar-timezone {display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:9px 0 0 !important;font-size:12px;color:#54665c;}
body.mvn-ui-v3 .mp-calendar-timezone strong {color:#285941;letter-spacing:.01em;}
body.mvn-ui-v3 .mp-calendar-view-switch {display:inline-flex;align-items:center;gap:3px;border:1px solid #cfdcd2;border-radius:9px;background:#f7faf7;padding:4px;}
body.mvn-ui-v3 .mp-calendar-view-switch a {display:inline-flex;align-items:center;justify-content:center;min-height:37px;padding:7px 15px;border-radius:6px;text-decoration:none;color:#486557;font-size:13px;font-weight:720;}
body.mvn-ui-v3 .mp-calendar-view-switch a[aria-current="page"] {background:#173f32;color:#fff;}
body.mvn-ui-v3 .mp-calendar-view-switch a:hover:not([aria-current="page"]) {background:#e7eee7;}
body.mvn-ui-v3 .mvn-calendar-filter-panel {width:100%;}
body.mvn-ui-v3 .mvn-calendar-filter-panel > summary {cursor:pointer;display:flex;align-items:center;gap:9px;min-height:43px;font-size:13px;font-weight:750;color:#254936;list-style-position:inside;}
body.mvn-ui-v3 .mvn-calendar-filter-panel > summary span {font-size:11px;font-weight:600;color:#66756c;margin-inline-start:auto;}
body.mvn-ui-v3 .mvn-calendar-filter-panel[open] > summary {margin-bottom:13px;}
body.mvn-ui-v3 .mvn-calendar-filter {align-items:center;gap:10px 13px;}
body.mvn-ui-v3 .mvn-calendar-filter .check {min-height:34px;display:inline-flex;align-items:center;}
body.mvn-ui-v3 .mvn-calendar-counts {border-radius:10px;}
body.mvn-ui-v3 .mvn-calendar-counts div {min-width:0;}
body.mvn-ui-v3 .mvn-calendar-counts span {line-height:1.45;}
body.mvn-ui-v3 .mvn-calendar-agenda-event {border-radius:8px;min-height:48px;}
body.mvn-ui-v3 .mvn-calendar-agenda-event:focus-visible,
body.mvn-ui-v3 .mvn-calendar-event:focus-visible,
body.mvn-ui-v3 .mp-calendar-view-switch a:focus-visible {outline:3px solid #b78c47;outline-offset:2px;}
body.mvn-ui-v3 .mvn-calendar-shell[data-calendar-view="agenda"] .mvn-calendar-grid-wrap {display:none !important;}
body.mvn-ui-v3 .mvn-calendar-shell[data-calendar-view="month"] .mvn-calendar-agenda {display:none !important;}
body.mvn-ui-v3 .mvn-calendar-agenda-events > * {min-width:0;}
body.mvn-ui-v3 .mvn-calendar-agenda-event strong {overflow-wrap:anywhere;}

/* APPOINTMENT BOOKING — PRESERVE POST, CSRF, TOKEN AND BACKEND VALIDATION */
body.mvn-humanized .auth-card.mp-booking-card {width:min(100%,710px);max-width:710px;min-width:0;}
.mp-booking-head {margin-bottom:20px;}
.mp-booking-head .mp-booking-eyebrow {display:block;color:#2d7052;font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:780;margin-bottom:9px;}
.mp-booking-head h1 {margin:0 0 8px;font-size:clamp(27px,3vw,36px);line-height:1.16;letter-spacing:-.035em;}
.mp-booking-head p {line-height:1.65;margin:0 0 9px;color:#53635a;}
.mp-booking-timezone {display:inline-flex;gap:7px;flex-wrap:wrap;padding:9px 12px;background:#f1f6f1;border:1px solid #d6e3d8;border-radius:7px;color:#365742;font-size:12px;}
.mp-booking-slots {display:grid;gap:13px;margin:20px 0;}
body.mvn-humanized .mp-booking-slot {margin:0 !important;border:1px solid #d7e1d8 !important;border-radius:10px !important;padding:18px !important;background:#fff !important;}
.mp-booking-slot-head {display:flex;align-items:start;justify-content:space-between;gap:14px;}
.mp-booking-slot-details {min-width:0;}
.mp-booking-slot h2 {font-size:18px;line-height:1.3;margin:0 0 9px;overflow-wrap:anywhere;}
.mp-booking-slot p {line-height:1.55;margin:0;}
.mp-booking-slot time {display:block;font-size:13px;font-weight:720;color:#204d39;margin-bottom:5px;}
.mp-booking-slot .mp-booking-host {display:block;font-size:12px;color:#63756b;}
.mp-booking-capacity {display:inline-flex;font-size:11px;font-weight:770;background:#eaf4ed;color:#245c40;padding:6px 9px;border-radius:6px;white-space:nowrap;}
.mp-booking-slot .field {margin:15px 0 0;}
.mp-booking-slot .field label {display:block;margin:0 0 7px;}
.mp-booking-slot textarea {width:100%;max-width:100%;min-height:64px;resize:vertical;}
.mp-booking-slot .mp-booking-submit {margin-top:15px;min-height:44px;min-width:170px;}
.mp-booking-slot :is(button,textarea):focus-visible {outline:3px solid #b78c47;outline-offset:2px;}
.mp-booking-empty {padding:25px 20px;text-align:start;border:1px solid #d7e1d8;background:#f8faf7;border-radius:10px;line-height:1.65;}
.mp-booking-empty strong {display:block;font-size:15px;margin-bottom:4px;color:#204b3a;}

/* THEME, DIRECTION AND SMALL SCREENS */
html[data-mvn-theme="dark"] body.mvn-ui-v3 .mvn-admin5-head,
html[data-mvn-theme="dark"] body.mvn-ui-v3 .mvn-myday-hero {background:var(--hx-surface,#1c2923) !important;border-color:#40534a !important;}
html[data-mvn-theme="dark"] body.mvn-ui-v3 .mvn-myday-action {background:var(--hx-surface,#1c2923) !important;border-color:#4e6757 !important;}
html[data-mvn-theme="dark"] body.mvn-ui-v3 .mp-calendar-view-switch {background:#23362d;border-color:#4d6655;}
html[data-mvn-theme="dark"] body.mvn-ui-v3 .mp-calendar-view-switch a {color:#e6eee8;}
html[data-mvn-theme="dark"] body.mvn-ui-v3 .mp-calendar-view-switch a[aria-current="page"] {background:#c9ddbf;color:#173528;}
html[data-mvn-theme="dark"] body.mvn-ui-v3 .mp-calendar-timezone,
html[data-mvn-theme="dark"] body.mvn-ui-v3 .mp-calendar-timezone strong,
html[data-mvn-theme="dark"] body.mvn-ui-v3 .mvn-calendar-filter-panel > summary {color:#d8eadd;}
html[data-mvn-theme="dark"] body.mvn-humanized .mp-booking-slot {background:var(--hx-surface,#1c2923) !important;border-color:#4d6655 !important;}
html[data-mvn-theme="dark"] .mp-booking-timezone,html[data-mvn-theme="dark"] .mp-booking-empty {background:#213d31;border-color:#4d6655;color:#e2eee5;}
html[data-mvn-theme="dark"] .mp-booking-slot time,html[data-mvn-theme="dark"] .mp-booking-empty strong {color:#d8eadc;}
html[data-mvn-theme="dark"] .mp-booking-capacity {background:#244c35;color:#d8f0df;}
html[dir="rtl"] .mp-service-panel li::after {content:"↖";}
@media(max-width:1080px) {
  body.mvn-public-v2.mvn-humanized.mp-refined-v2 .mvn-public-hero-grid {
    grid-template-columns:minmax(0,1fr) minmax(300px,.8fr) !important;
    gap:36px !important;
  }
  body.mvn-ui-v3 .mvn-admin5-head {grid-template-columns:1fr !important;}
}
@media(max-width:920px) {
  body.mvn-public-v2.mvn-humanized.mp-refined-v2 .mvn-public-hero-grid {grid-template-columns:minmax(0,1fr) !important;gap:32px !important;}
  body.mvn-public-v2.mp-refined-v2 .mp-service-panel {max-width:700px;min-height:350px;}
  .mp-service-panel-art {height:68px;margin:8px 0;}
  .mp-service-panel-art::before {width:58px;height:58px;}
  .mp-service-panel-art::after {width:55px;height:55px;}
  .mp-service-panel-art svg {width:38px;height:38px;}
  body.mvn-ui-v3 .mvn-myday-main {grid-template-columns:minmax(0,1fr) !important;}
}
@media(max-width:760px) {
  body.mvn-public-v2.mp-refined-v2 .mp-service-panel {padding:24px;min-height:0;}
  .mp-service-panel-art {display:none;}
  body.mvn-public-v2.mp-refined-v2 .mp-service-panel h2 {margin-top:16px;font-size:27px;}
  body.mvn-ui-v3 .mvn-admin5-kpis {grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  body.mvn-ui-v3 .mvn-myday-hero {grid-template-columns:minmax(0,1fr) !important;}
  body.mvn-ui-v3 .mvn-myday-action {max-width:none;min-width:0;}
  body.mvn-ui-v3 .mvn-myday-metrics {grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  body.mvn-ui-v3 .mvn-calendar-hero {align-items:flex-start;}
  body.mvn-ui-v3 .mvn-calendar-counts {grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  body.mvn-ui-v3 .mvn-calendar-counts div {border-bottom:1px solid #dae4dc;}
  body.mvn-ui-v3 .mvn-calendar-counts div:nth-child(2n) {border-inline-end:0;}
  body.mvn-ui-v3 .mvn-calendar-shell[data-calendar-view="month"] .mvn-calendar-grid-wrap {display:block !important;}
  body.mvn-ui-v3 .mvn-calendar-shell[data-calendar-view="agenda"] .mvn-calendar-grid-wrap {display:none !important;}
  .mp-booking-slot-head {flex-direction:column;}
  .mp-booking-capacity {align-self:start;}
}
@media(max-width:520px) {
  body.mvn-public-v2.mvn-humanized.mp-refined-v2 .mvn-public-hero-grid {gap:27px !important;}
  body.mvn-public-v2.mp-refined-v2 .mp-service-panel {padding:21px;}
  body.mvn-public-v2.mp-refined-v2 .mp-service-panel h2 {font-size:24px;}
  .mp-service-panel li {padding:10px 0;}
  body.mvn-ui-v3 .mvn-admin5-head-actions {width:100%;}
  body.mvn-ui-v3 .mvn-calendar-hero {gap:12px;}
  body.mvn-ui-v3 .mp-calendar-view-switch {width:100%;justify-content:stretch;}
  body.mvn-ui-v3 .mp-calendar-view-switch a {flex:1;}
  body.mvn-ui-v3 .mvn-calendar-agenda-event {grid-template-columns:minmax(67px,.3fr) minmax(0,1fr) !important;gap:10px;}
  body.mvn-ui-v3 .mvn-calendar-type {grid-column:2;}
  body.mvn-ui-v3 .mvn-calendar-counts {grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  body.mvn-ui-v3 .mvn-calendar-counts div:nth-child(n) {border-bottom:1px solid #dae4dc;}
  body.mvn-ui-v3 .mvn-calendar-counts div:nth-last-child(-n+2) {border-bottom:0;}
  .mp-booking-slot .mp-booking-submit {width:100%;}
}
@media(prefers-reduced-motion:reduce) {
  body.mvn-public-v2.mp-refined-v2 .mp-service-panel,body.mvn-ui-v3 .mvn-calendar-agenda-event {transition:none !important;animation:none !important;}
}
