/* Shared beta button contract. Important declarations intentionally supersede
   legacy page-specific skins; layout (width/margins) remains with each page. */
:root {
  --button-small-height:44px;
  --button-medium-height:48px;
  --button-large-height:56px;
  --button-font-size:16px;
  --button-line-height:24px;
  --button-height:var(--button-medium-height);
  --button-radius:999px;
  --button-soft-bg:var(--tone-fill-ededed,#ededed);
  --button-soft-hover:var(--tone-fill-dfdfdf,#dfdfdf);
}
/* A small contrast increase for soft actions directly on the gray page. */
@media (prefers-color-scheme:light) {
  body:not(.panel-document) .btn--on-gray { --button-soft-bg:#e6e6e6; }
}
:is(.btn,.group-picker-open,.admin-logo-upload,.admin-logo-remove,.profile-text-action,.admin-logo-edit,.passenger-edit,.journey-edit,.create-cancel,.avboka-korning) {
  --button-bg:var(--button-soft-bg); --button-ink:var(--tone-ink-0d0d0d,#0d0d0d); --button-border:transparent;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  box-sizing:border-box; cursor:pointer;
  font-family:var(--font) !important; font-size:var(--button-font-size) !important;
  line-height:var(--button-line-height) !important; font-weight:500 !important;
  min-height:var(--button-height) !important; padding:11px 20px !important;
  border:1px solid var(--button-border) !important; border-radius:var(--button-radius) !important;
  background:var(--button-bg) !important; color:var(--button-ink) !important;
  box-shadow:none !important; text-decoration:none !important; transform:none !important;
  text-align:center; white-space:normal;
}
/* Three shared sizes. Existing sm/lg/compact classes remain aliases. */
:is(.btn.btn--small,.btn.sm,.btn.btn--compact) {
  --button-font-size:14px; --button-line-height:20px; --button-height:var(--button-small-height);
  padding:11px 12px !important;
}
.btn.btn--medium {
  --button-font-size:16px; --button-line-height:24px; --button-height:var(--button-medium-height);
  padding:11px 20px !important;
}
:is(.btn.btn--large,.btn.lg), body .login-form .btn.primary {
  --button-font-size:17px; --button-line-height:24px; --button-height:var(--button-large-height);
  padding:15px 24px !important;
}
:is(.btn.btn--small,.btn.sm,.btn.btn--compact) > svg {
  width:16px; height:16px; flex-basis:16px;
}
.group-list-card .spread { flex-wrap:wrap; }
.group-list-card .person { flex:1 1 160px; min-width:0; }
.btn.group-open { flex:0 0 auto; margin-left:auto; white-space:nowrap; }
/* Compact text actions retain a 44px touch target. */
:is(.group-picker-open,.profile-text-action,.admin-logo-edit,.passenger-edit,.journey-edit,.create-cancel) {
  --button-font-size:14px; --button-line-height:20px; --button-height:44px;
  padding:11px 16px !important;
}
/* A compact 32px surface within the page action's 44px touch target. */
body .schedule-heading .group-picker-open {
  position:relative; isolation:isolate; gap:6px;
  padding:11px 12px !important; border:0 !important; background:transparent !important;
}
body .schedule-heading .group-picker-open::before {
  content:""; position:absolute; inset:6px 0; z-index:-1;
  border-radius:inherit; background:var(--button-bg); pointer-events:none;
}
body .schedule-heading .group-picker-open svg { width:16px; height:16px; }
:is(.btn.primary,.admin-logo-upload,.chat-send) { --button-bg:#181818; --button-ink:#fff; }
:is(.btn.danger,.admin-logo-remove,.avboka-korning) { --button-bg:#ffd9d9; --button-ink:#ba2623; }
:is(.btn.danger-solid,.btn.confirm-ok) { --button-bg:#e02e2a; --button-ink:#fff; }
.btn--outline { --button-bg:transparent; --button-border:var(--tone-edge-cdcdcd,#cdcdcd); }
.journey-sheet-footer .btn--outline { --button-bg:var(--tone-fill-ffffff,#fff); }
.journey-sheet-footer .btn--outline:active:not(:disabled) { --button-bg:var(--button-soft-bg); opacity:1; }
:is(.profile-text-action,.admin-logo-edit,.passenger-edit,.journey-edit,.create-cancel) { --button-bg:transparent; padding-inline:8px !important; }
/* Icon controls use the same neutral palette, without changing nav/choice rows. */
:is(.sheet-close,.reaction-sheet-close,.btn-x,.pw-toggle,.chat-send,.chat-react-trigger,.install-x,.nav-back) {
  --button-bg:transparent; --button-ink:var(--tone-ink-5d5d5d,#5d5d5d);
  display:inline-flex; align-items:center; justify-content:center;
  box-sizing:border-box; min-width:44px !important; min-height:44px !important;
  width:44px; height:44px; padding:0 !important;
  background:var(--button-bg) !important; color:var(--button-ink) !important;
  border:0 !important; border-radius:999px; box-shadow:none !important;
  font-family:var(--font) !important; font-size:24px; font-weight:400; cursor:pointer;
}
:is(.sheet-close,.reaction-sheet-close,.nav-back) { --button-bg:var(--button-soft-bg); }
/* Center without a transform, which the shared hover reset would remove. */
body .pw-toggle { top:calc(50% - 22px); transform:none; }
.chat-send { --button-bg:#181818; --button-ink:#fff; }
.btn-x { --button-ink:#ba2623; }
:is(.btn,.group-picker-open,.admin-logo-upload,.admin-logo-remove,.profile-text-action,.admin-logo-edit,.passenger-edit,.journey-edit,.create-cancel,.avboka-korning,.sheet-close,.reaction-sheet-close,.btn-x,.pw-toggle,.chat-send,.chat-react-trigger,.install-x,.nav-back):focus-visible {
  outline:2px solid var(--tone-ink-181818,#181818) !important; outline-offset:3px !important;
}
/* No hover color/scale changes. Press and keyboard focus provide feedback. */
:is(.btn,.group-picker-open,.admin-logo-upload,.admin-logo-remove,.profile-text-action,.admin-logo-edit,.passenger-edit,.journey-edit,.create-cancel,.avboka-korning,.sheet-close,.reaction-sheet-close,.btn-x,.pw-toggle,.chat-send,.chat-react-trigger,.install-x,.nav-back):hover { filter:none; transform:none !important; }
:is(.btn,.group-picker-open,.admin-logo-upload,.admin-logo-remove,.profile-text-action,.admin-logo-edit,.passenger-edit,.journey-edit,.create-cancel,.avboka-korning,.sheet-close,.reaction-sheet-close,.btn-x,.pw-toggle,.chat-send,.chat-react-trigger,.install-x,.nav-back):active:not(:disabled) { opacity:.8; }
:is(.btn,.group-picker-open,.admin-logo-remove,.profile-text-action,.admin-logo-edit,.passenger-edit,.journey-edit,.sheet-close,.reaction-sheet-close,.btn-x,.pw-toggle,.chat-send,.chat-react-trigger):disabled {
  --button-bg:var(--tone-fill-ededed,#ededed); --button-ink:var(--tone-ink-767676,#767676); --button-border:transparent;
  cursor:default; opacity:1 !important;
}
/* Specialized controls retain their semantic shape and 44px minimum area. */
:is(.stepper button,.edit-seat-stepper button,.chat-emoji-option,.chat-reaction-count) { min-width:44px !important; min-height:44px !important; font-family:var(--font); }
:is(.stepper button,.edit-seat-stepper button,.stepper-buttons button) { appearance:none; -webkit-appearance:none; color:var(--tone-ink-0d0d0d,#0d0d0d) !important; -webkit-text-fill-color:currentColor; }
:is(.stepper button,.edit-seat-stepper button,.stepper-buttons button):disabled { color:var(--tone-ink-767676,#767676) !important; cursor:default; }

/* Back is a shared icon action on every subpage. */
html body .back-fab { width:44px; height:44px; min-width:44px; min-height:44px; justify-content:center; border:0 !important; border-radius:50%; background:#181818 !important; color:#fff !important; box-shadow:none !important; }
html body .back-fab svg { width:24px; height:24px; margin:0; transform:rotate(180deg); }
html body .back-fab:hover { background:#181818; }
html body .back-fab:focus-visible { outline:2px solid var(--tone-ink-181818,#181818); outline-offset:3px; }

/* Disclosure action: same type/ink as a standard button, row geometry. */
html body .admin-new-family > summary { display:flex; align-items:center; gap:8px; min-height:48px; padding:12px 0; font-family:var(--font); font-size:16px; line-height:24px; font-weight:500; color:var(--tone-ink-0d0d0d,#0d0d0d); }
html body .admin-new-family > summary::before { content:none; }
/* The disclosure hit area reaches the card edges; its rounded card clips hover. */
html body .admin-page .admin-new-family { overflow:hidden; }
html body .admin-page :is(.admin-family,.admin-new-family) > summary {
  margin-inline:-18px; padding-inline:18px;
}
html body .admin-page :is(.admin-family,.admin-new-family) > summary:focus-visible {
  outline:2px solid var(--tone-ink-181818,#181818); outline-offset:-3px;
}
.family-add-icon { display:block; width:24px; height:24px; flex:0 0 24px; }
.family-add-minus, .admin-new-family[open] .family-add-plus { display:none; }
.admin-new-family[open] .family-add-minus { display:block; }

/* Hover belongs to a precise pointer, never to touch-only devices. */
@media (min-width:768px) and (hover:hover) and (pointer:fine) {
  :is(.btn,.group-picker-open,.admin-logo-upload,.admin-logo-remove,.profile-text-action,.admin-logo-edit,.passenger-edit,.journey-edit,.create-cancel,.avboka-korning,.sheet-close,.reaction-sheet-close,.btn-x,.pw-toggle,.chat-send,.chat-react-trigger,.install-x,.nav-back):hover:not(:disabled) {
    --button-bg:var(--button-soft-hover);
  }
  :is(.btn.primary,.admin-logo-upload,.chat-send):hover:not(:disabled) { --button-bg:#303030; }
  :is(.btn.danger,.admin-logo-remove,.avboka-korning):hover:not(:disabled) { --button-bg:#ffc5c5; }
  :is(.btn.danger-solid,.btn.confirm-ok):hover:not(:disabled) { --button-bg:#ba2623; }
  :is(.profile-text-action,.admin-logo-edit,.passenger-edit,.journey-edit,.create-cancel,.btn--outline):hover:not(:disabled) { --button-bg:var(--button-soft-bg); }
  html body .back-fab:hover { background:#303030 !important; }
  body .journey .seat-book:hover::before { background:var(--button-soft-hover); }
  body :is(.stepper,.edit-seat-stepper) button:hover:not(:disabled) { background:var(--button-soft-hover); }
  body .chat-picker .chat-emoji-option:hover { background:transparent; }
  body .chat-reaction-count:hover .chat-reaction-badge { background:var(--tone-fill-f9f9f9,#f9f9f9); }
  body .admin-new-family > summary:hover,
  body .admin-family-summary:hover,
  body .group-picker-row:not(.group-picker-row--static):hover { background:var(--tone-fill-f9f9f9,#f9f9f9); }
}
@media (max-width:767px), (hover:none), (pointer:coarse) {
  html body .back-fab:hover { background:#181818 !important; }
  body .journey .seat-book:hover::before { background:var(--button-soft-bg); }
  body :is(.stepper,.edit-seat-stepper) button:hover { background:transparent; }
  body .admin-logo-upload:hover, body .admin-logo-remove:hover { background:var(--button-bg) !important; }
}
@media (max-width:767px), (hover:none), (pointer:coarse) {
  body .admin-page .offer-extra > summary:hover { background:var(--tone-fill-ededed,#ededed); }
  body .account-profile .offer-extra > summary:hover { background:transparent; }
}
/* Legacy danger:hover faded the entire control; hover must preserve contrast. */
html body .btn:hover:not(:disabled) { opacity:1; }

/* Journey and family actions share the same full-row pointer feedback. */
@media (min-width:768px) and (hover:hover) and (pointer:fine) {
  body :is(.journey-link,button.family-person-row):hover {
    background:var(--tone-fill-f5f5f5,#f5f5f5);
    border-radius:0;
    box-shadow:none;
  }
}

/* Close actions share the back button's dark circular treatment. */
html body :is(.sheet-close,.reaction-sheet-close,.install-x) {
  --button-bg:#181818; --button-ink:#fff;
  border-radius:50% !important;
}
@media (min-width:768px) and (hover:hover) and (pointer:fine) {
  html body :is(.sheet-close,.reaction-sheet-close,.install-x):hover:not(:disabled) { --button-bg:#303030; }
}

body #load-more { width:100%; min-height:48px; font-size:16px; line-height:24px; margin:8px 0 24px; }

@media (min-width:768px) and (hover:hover) and (pointer:fine) {
  body .journey:has(> .journey-link:first-child:hover)::before,
  body .journey-link:hover::before,
  body .journey-link:hover + .journey-link::before,
  body .journey:has(> .journey-link:last-child:hover) + .sched-div + .journey::before,
  body .family-people > li:has(> button.family-person-row:hover)::before,
  body .family-people > li:has(> button.family-person-row:hover) + li::before { opacity:0; }
}

body .profile-logout { --button-bg:var(--button-soft-bg); gap:8px; border-color:transparent !important; }
body .profile-logout svg { flex:none; }
@media (min-width:768px) and (hover:hover) and (pointer:fine) { body .profile-logout:hover { --button-bg:var(--button-soft-hover); } }

/* Programmatic focus after pointer navigation is not keyboard focus. */
html[data-input-mode=pointer] body :is(a,button,summary,dialog,[tabindex]):focus {
  outline:none !important;
}
html[data-input-mode=pointer] body :is(input[type=radio],input[type=checkbox]):focus-visible + :is(span,.track),
html[data-input-mode=pointer] body .segment label:has(input:focus-visible) span,
html[data-input-mode=pointer] body :is(.admin-logo-upload,.profile-photo-upload):focus-within {
  outline:none !important;
}

@media (min-width:768px) and (hover:hover) and (pointer:fine) {
  body .sched-item .journey-link { margin-inline:-18px; padding-inline:18px; }
  body .sched-item .journey-link + .journey-link::before { left:calc(var(--journey-icon) + 30px); right:18px; }
  /* The card clips the fill at its outer corners; interior row edges stay square. */
  body .sched-item .journey-link:hover { border-radius:0; }
}

/* One shared OpenAI Edit icon for every edit action. */
body .icon-edit { width:18px; height:18px; flex:0 0 18px; vertical-align:middle; }
body :is(.child-edit-toggle,.edit-link) { display:inline-flex; align-items:center; gap:8px; }

/* Edit actions reveal their button surface on desktop hover. */
html body :is(.profile-text-action,.admin-logo-edit,.passenger-edit,.journey-edit,.child-edit-toggle,.edit-link) {
  --button-bg:transparent;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:44px !important; padding:11px 16px !important;
  border:1px solid transparent !important; border-radius:999px;
  background:var(--button-bg) !important; color:var(--tone-ink-0d0d0d,#0d0d0d) !important;
  font-family:var(--font); font-size:14px !important; line-height:20px; font-weight:500;
  text-decoration:none; white-space:nowrap; opacity:1; flex-shrink:0;
}
@media (min-width:768px) and (hover:hover) and (pointer:fine) {
  html body :is(.profile-text-action,.admin-logo-edit,.passenger-edit,.journey-edit,.child-edit-toggle,.edit-link):hover,
  html body .child-summary:hover .child-edit-toggle { --button-bg:var(--button-soft-bg); opacity:1; }
}

@media (min-width:768px) and (hover:hover) and (pointer:fine) {
  body .journey-layout .create-journey-link:hover { background:var(--tone-fill-f5f5f5,#f5f5f5); box-shadow:none; }
}

/* Touch feedback is temporary and never changes the control's geometry. */
@media (max-width:767px), (hover:none), (pointer:coarse) {
  body :is(a,button,summary,input[type=checkbox],input[type=radio],label) { -webkit-tap-highlight-color:transparent; }
  body :is(.tabbar .tab,.topbtn,.card-link):active { transform:none; }
  body :is(.tabbar .tab,.topbtn,.card-link,.journey-link,.create-journey-link,.account-sections a,button.family-person-row):active { opacity:.8; }
}
html[data-input-mode=pointer] body :is(input[type=checkbox],input[type=radio]):focus { outline:none !important; box-shadow:none !important; }
