/* Shared form controls and navigation. Loaded after page-specific styles. */
:root{--control-height:42px;--control-radius:10px;--control-border:#d8e3dc;--control-focus:#87b49b}
:is(.app-body,.public-body) .button,.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--control-height);height:auto;max-width:100%;padding:10px 16px;border-radius:var(--control-radius);font-size:12px;font-weight:600;line-height:1.4;letter-spacing:.1px;text-align:center;text-decoration:none;white-space:normal;overflow-wrap:anywhere;transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}
:is(.form-stack,.priority-card,.import-card,.modal,.invitation-builder,.rsvp-form,.wish-form,.package-card) .button{min-height:var(--control-height);font-size:12px;line-height:1.4;padding:10px 16px;border-radius:var(--control-radius)}
:is(.form-stack,.priority-card,.import-card)>.button,.priority-card .form-stack>.button{width:fit-content;max-width:100%;align-self:flex-start;justify-self:start;flex:0 0 auto}
:is(.app-body,.public-body) .form-stack>.button,.invitation-builder .invitation-heading-actions .button{min-height:var(--control-height);height:auto;line-height:1.4}
:is(.app-body,.admin-content,.auth-shell,.onboarding) .button-primary{background:linear-gradient(135deg,#487962,#315c48);border-color:#315c48;color:#fff;box-shadow:0 3px 9px #315c481a,inset 0 1px 0 #ffffff20}
:is(.app-body,.admin-content,.auth-shell,.onboarding) .button-outline{background:#fff;border-color:var(--control-border);color:#425e4e;box-shadow:0 1px 3px #263e2f0a}
.button-danger{background:linear-gradient(135deg,#b4594d,#934336);border:1px solid #934336;color:#fff;box-shadow:0 3px 9px #93433618}
.button:active{transform:translateY(0) scale(.98)}
.button:disabled,.button[aria-disabled=true]{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none}
.button:focus-visible,.icon-button:focus-visible,.platform-tabs a:focus-visible,summary:focus-visible{outline:3px solid var(--control-focus);outline-offset:3px;box-shadow:none}
.button-row{display:flex;align-items:center;flex-wrap:wrap;gap:8px;min-width:0}
.button-row>.button,.button-row>form{flex:0 1 auto;min-width:0}
.button-row>form{margin:0}
.icon-button{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;min-width:36px;border:1px solid #dce6df;border-radius:10px;background:#ffffffc9;color:#587363;transition:background-color .18s ease,border-color .18s ease,transform .18s ease}
.icon-button.danger{color:#a55246;border-color:#ead6d1;background:#fff8f6}
.form-stack{gap:14px;align-items:stretch}
:is(.app-body,.public-body) :is(.form-stack,.priority-card,.import-card,.payment-review,.billing-history) label{display:block;min-width:0;font-size:12px;line-height:1.5}
.field-caption{display:block;line-height:inherit}
label .required-mark{display:inline;white-space:nowrap;margin-left:4px;line-height:1;vertical-align:baseline}
:is(.form-stack,.priority-card,.import-card,.payment-review,.billing-history) label>:is(input:not([type=checkbox]):not([type=radio]),select,textarea,.password-field){display:block;margin-top:6px}
:is(.form-stack,.priority-card,.import-card) :is(input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),select){width:100%;height:44px;min-height:44px;padding:9px 12px;border:1px solid var(--control-border);border-radius:var(--control-radius);background-color:#fff;font-size:13px;line-height:1.4;box-shadow:0 1px 2px #253e2e05;transition:border-color .18s ease,box-shadow .18s ease}
:is(.form-stack,.priority-card,.import-card) textarea{width:100%;min-height:88px;padding:10px 12px;border:1px solid var(--control-border);border-radius:var(--control-radius);line-height:1.6}
:is(.form-stack,.priority-card,.import-card) input[type=file]{height:auto;min-height:44px;padding:8px 10px;border-radius:var(--control-radius)}
:is(.form-stack,.priority-card,.import-card) input[type=file]::file-selector-button{margin-right:10px;padding:6px 10px;border:1px solid #d8e3da;border-radius:6px;background:#eef4ee;color:#42624d;cursor:pointer;font:inherit}
:is(.form-stack,.priority-card,.import-card) :is(input,select,textarea):focus-visible{outline:0;border-color:#7ea68d;box-shadow:0 0 0 3px #7ea68d26}
:is(.form-stack,.priority-card,.import-card) :is(input[type=checkbox],input[type=radio]){width:18px;height:18px;min-height:18px;min-width:18px;padding:0;margin:0;flex:0 0 18px;accent-color:#487962}
:is(.form-stack,.priority-card,.import-card) label>input:is([type=checkbox],[type=radio]){margin-top:1px}
:is(.app-body,.public-body) :is(.form-stack,.priority-card,.import-card) label:has(>input:is([type=checkbox],[type=radio])){display:flex;flex-direction:row;align-items:flex-start;gap:9px}
.form-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.form-field>label{margin:0}
.form-field>.password-field{margin:0}
.password-toggle{width:36px;height:36px;right:4px;border-radius:7px}
.password-toggle .icon{width:18px;height:18px}
.profile-grid{gap:20px;align-items:start}
.profile-grid h2{font-size:21px;letter-spacing:-.4px}
.profile-content .profile-verification{padding:16px 20px;gap:8px}
.profile-verification h2{font:600 14px/1.5 var(--sans);letter-spacing:0}
.profile-verification p{font-size:12px;line-height:1.6}
.profile-content .account-panel{padding:0;margin-top:20px;overflow:hidden}
.account-panel>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:56px;padding:16px 20px;font-size:14px;font-weight:600;color:#425e4e;cursor:pointer}
.account-panel>summary::-webkit-details-marker{display:none}
.account-panel>summary::after{content:'';width:8px;height:8px;flex-shrink:0;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);transition:transform .18s ease}
.account-panel[open]>summary::after{transform:rotate(225deg)}
.account-panel[open]>summary{border-bottom:1px solid #e3e9e0}
.account-panel-body{padding:18px 20px 20px}
.account-panel-body>p{font-size:12px;line-height:1.7;margin-bottom:16px;color:#72816d}
.account-panel-body>.form-stack{max-width:620px}
.profile-content .account-danger{border-color:#e9d5cf;background:#fffbf9}
.account-danger>summary{color:#9b4f42}
.profile-grid .editor-form{padding:22px}
.platform-navigation{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:8px;margin:16px 0 22px;border:1px solid #dfe8df;border-radius:13px;background:#ffffffd9;box-shadow:0 2px 7px #2c483807}
.platform-tabs{display:flex;flex-wrap:wrap;gap:4px;min-width:0}
.platform-tabs a{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:9px 11px;border:1px solid transparent;border-radius:8px;font-size:11px;font-weight:600;color:#748373;white-space:nowrap;transition:background-color .18s ease,color .18s ease}
.platform-tabs a.active{background:#e9f1e8;border-color:#d6e5d5;color:#3f6547}
.platform-tabs .icon{width:15px;height:15px}
.platform-utilities{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.platform-utilities .button{min-height:36px;padding:8px 10px;font-size:11px}
.platform-utilities form{margin:0}
.nav-section-label{font-size:8px;font-weight:700;letter-spacing:1.3px;color:#99a28e;padding:14px 13px 3px}
.main-nav{gap:4px;margin-top:20px}
.main-nav a{padding-block:10px}
.sidebar-note{padding:14px;margin-top:20px}
.sidebar-note a{width:100%;align-items:center;justify-content:flex-start;gap:8px;margin:0;padding:0;border:0;min-height:32px}
.account-profile-link{display:flex;flex-direction:column;justify-content:center;min-height:44px}
.account-profile-link:focus-visible{outline:3px solid var(--control-focus);outline-offset:4px;border-radius:4px}
.next-steps .step{cursor:default}
.invitation-actions>.helper-text{margin:0;line-height:1.7}
.invitation-actions .button{flex:0 1 auto}
.main-content .dashboard-heading>.button{display:inline-flex}
.public-body :is(.landing-nav,.wedding-nav) .button{min-height:36px;padding:8px 12px;font-size:11px}
.auth-bottom{margin-top:20px}
@media(hover:hover){
    .button:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 4px 12px #2d493819}
    :is(.app-body,.admin-content,.auth-shell,.onboarding) .button-primary:not(:disabled):hover{background:linear-gradient(135deg,#3f6d55,#294f3d)}
    :is(.app-body,.admin-content,.auth-shell,.onboarding) .button-outline:not(:disabled):hover{background:#f4f8f2;border-color:#bccfbd}
    .button-danger:not(:disabled):hover{background:#934336}
    .icon-button:hover{background:#edf3eb;border-color:#bdd0be}
    .platform-tabs a:hover{background:#f1f6ee;color:#456a4a}
}
@media(max-width:800px){
    .platform-navigation{align-items:stretch;gap:10px}
    .platform-tabs{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
    .platform-tabs a{white-space:normal;min-height:44px}
    .platform-utilities{width:100%;padding:4px 3px 0;border-top:1px solid #e7ede4}
}
@media(max-width:700px){
    :root{--control-height:44px}
    .button-row>.button,.button-row>form{flex:0 1 auto}
    :is(.form-stack,.priority-card,.import-card) :is(input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),select,textarea){font-size:16px;line-height:1.4}
    .icon-button{min-width:44px;width:44px;height:44px}
    .password-toggle{width:44px;height:44px;right:1px}
    .profile-grid .editor-form{padding:20px}
    .profile-content .account-panel{margin-top:16px}
    .account-panel>summary,.account-panel-body{padding-inline:18px}
    .platform-utilities .button{min-height:44px}
    .public-body :is(.landing-nav,.wedding-nav) .button{min-height:44px}
    .main-content .dashboard-heading>.button{max-width:100%}
}
html[lang=my] .button{line-height:1.7;letter-spacing:0}
html[lang=my] :is(.form-stack,.priority-card,.import-card,.payment-review,.billing-history) label{line-height:1.9}
@media(max-width:700px){html[lang=my] :is(.form-stack,.priority-card,.import-card) :is(input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),select){height:48px;min-height:48px;line-height:1.7}}
@media(prefers-reduced-motion:reduce){.button,.icon-button,.platform-tabs a,.account-panel>summary::after{transition:none;transform:none!important}}
@media print{.platform-navigation,.account-panel,.nav-section-label{display:none!important}}

/* Full-list invitation totals stay compact above the search controls. */
.guest-status-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 14px 18px; border-bottom: 1px solid var(--line); }
.guest-status-summary > div { display: flex; flex-direction: column; justify-content: space-between; min-width: 0; padding: 9px 12px; border: 1px solid var(--line); border-radius: 9px; background: #ffffff80; }
.guest-status-summary dt { display: flex; align-items: baseline; gap: 6px; color: #526457; font-size: 11px; line-height: 1.5; }
.guest-status-summary dd { margin: 4px 0 0; color: var(--ink); font-size: 21px; font-weight: 650; line-height: 1.2; font-variant-numeric: tabular-nums; }
.guest-status-summary .guest-status-total { background: #eaf0e8; border-color: #d8e3d6; }
.guest-status-dot { width: 6px; height: 6px; flex-shrink: 0; border-radius: 50%; background: #849087; }
.guest-status-attending .guest-status-dot { background: #587765; }
.guest-status-pending .guest-status-dot { background: #b18a3e; }
.guest-status-declined .guest-status-dot { background: #ad6a67; }
@media (max-width: 900px) {
    .guest-status-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 540px) {
    .guest-status-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; padding: 12px; }
    .guest-status-summary > div { padding: 8px 10px; }
    .guest-status-summary .guest-status-total { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 12px; }
    .guest-status-total dd { margin: 0; }
    .guest-status-summary dd { font-size: 20px; }
}
/* Compact guest controls with secondary actions revealed in the row. */
.guest-table-card td { vertical-align: top; }
.guest-tools { width: 264px; max-width: 100%; white-space: normal; }
.guest-tools .guest-actions { display: flex; flex-wrap: nowrap; align-items: stretch; gap: 6px; }
.guest-tools .guest-actions > .button {
    flex: 1 1 0;
    min-width: 0;
    min-height: 36px;
    padding: 7px 9px;
    font-size: 11px;
    border-radius: 8px;
    transform: none;
}
.guest-tools .guest-actions .guest-print-qr { background: #edf4ed; border-color: #d2e2d2; color: #355a42; }
.guest-tools .guest-actions .guest-more-trigger {
    flex: 0 0 36px;
    min-width: 36px;
    min-height: 36px;
    width: 36px;
    height: auto;
    border-radius: 8px;
    background: #fff;
    border-color: var(--control-border);
}
.guest-tools .guest-more-trigger[aria-expanded=true] { background: #e5eee4; border-color: #a8c1ac; color: #355a42; }
.guest-action-panel {
    position: static;
    width: 100%;
    max-width: none;
    max-height: none;
    margin: 8px 0 0;
    padding: 4px;
    background: #fff;
    color: #425e4e;
    border: 1px solid #dce6dc;
    border-radius: 10px;
    box-shadow: 0 4px 12px #2c48380a;
}
.guest-action-panel:not([open]) { display: none; }
.guest-action-header { display: flex; align-items: center; gap: 12px; padding: 10px 6px; border-bottom: 1px solid #e8ede6; margin-bottom: 4px; }
.guest-action-header > div { flex: 1; min-width: 0; }
.guest-action-header > div > span { display: block; color: #7b8976; font-size: 10px; }
.guest-action-header h3 { margin-top: 3px; font-size: 12px; letter-spacing: 0; overflow-wrap: anywhere; }
.guest-actions-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    gap: 5px;
    min-height: 36px;
    padding: 7px 9px;
    border: 1px solid #dce6d9;
    border-radius: 8px;
    background: #f3f6f0;
    color: #52694d;
    font: inherit;
    font-size: 11px;
}
.guest-actions-close .icon { width: 14px; height: 14px; }
.guest-actions-close:focus-visible { outline: 3px solid var(--control-focus); outline-offset: 2px; }
.guest-menu-copy { display: flex; flex-direction: column; min-width: 0; }
.guest-menu-copy small { display: none; }
.guest-action-group { display: grid; gap: 2px; }
.guest-sensitive-actions { margin-top: 4px; padding-top: 4px; border-top: 1px solid #e8ede6; }
.guest-menu-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 36px;
    padding: 8px 10px;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: #425e4e;
    font: inherit;
    font-size: 12px;
    text-align: left;
    text-decoration: none;
    white-space: normal;
    overflow-wrap: anywhere;
}
.guest-menu-item .icon { width: 16px; height: 16px; color: #728573; }
.guest-menu-danger, .guest-menu-danger .icon { color: #a55246; }
.guest-attendance { margin-top: 8px; }
.guest-attendance > summary {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 32px;
    padding: 5px 2px;
    color: #617660;
    font-size: 11px;
    cursor: pointer;
    list-style: none;
}
.guest-attendance > summary::-webkit-details-marker { display: none; }
.guest-attendance > summary .icon { width: 14px; height: 14px; }
.guest-attendance > summary small { margin-left: auto; color: #8a9984; font-size: 10px; }
.guest-attendance > summary::after {
    content: '';
    width: 6px;
    height: 6px;
    margin: 0 3px 3px 2px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg);
}
.guest-attendance[open] > summary::after { margin-top: 5px; transform: rotate(225deg); }
.guest-attendance-list { display: grid; gap: 8px; margin-top: 4px; }
.guest-event { padding: 12px; background: #f7f9f5; border: 1px solid #e3eade; border-radius: 9px; }
.guest-event-heading { display: flex; align-items: flex-start; flex-wrap: wrap; gap: 6px; }
.guest-event-heading strong { flex: 1 1 85px; min-width: 0; font-size: 11px; overflow-wrap: anywhere; }
.guest-tools .guest-event-heading .pill { font-size: 9px; padding: 3px 6px; white-space: normal; }
.guest-arrival-status { display: flex; align-items: center; gap: 5px; margin-top: 8px; color: #4e7856; font-size: 10px; }
.guest-arrival-status .icon { width: 13px; height: 13px; }
.guest-event-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.guest-event-controls label { display: flex; align-items: center; gap: 6px; color: #72816d; font-size: 10px; }
.guest-tools .checkin-count { width: 54px; min-height: 34px; height: 34px; padding: 5px; font-size: 12px; border-radius: 7px; }
.guest-tools .guest-event-controls .button { min-height: 34px; padding: 6px 9px; border-radius: 7px; font-size: 10px; }
.guest-menu-item:focus-visible, .guest-attendance > summary:focus-visible { outline: 3px solid var(--control-focus); outline-offset: 2px; }
@media (hover: hover) {
    .guest-menu-item:hover { background: #eff5ed; }
    .guest-menu-danger:hover { background: #fcf0ec; }
    .guest-attendance > summary:hover { color: #355a42; }
}
@media (max-width: 700px) {
    body.guest-actions-open { overflow: hidden; }
    .guest-tools { width: 100%; max-width: none; }
    .guest-tools .guest-actions > .button { min-height: 44px; font-size: 12px; }
    .guest-tools .guest-actions .guest-more-trigger { flex-basis: 44px; min-width: 44px; min-height: 44px; width: 44px; }
    .guest-menu-item, .guest-attendance > summary { min-height: 44px; }
    .guest-tools .checkin-count, .guest-tools .guest-event-controls .button { min-height: 44px; height: auto; }
    .guest-action-panel {
        position: fixed;
        inset: auto 0 0;
        width: 100%;
        max-width: 560px;
        max-height: calc(100vh - 24px);
        max-height: calc(100dvh - 24px);
        margin: 0 auto;
        padding: 0 16px max(18px, env(safe-area-inset-bottom));
        border: 0;
        border-radius: 22px 22px 0 0;
        box-shadow: 0 -12px 48px #182e3433;
        overflow-y: auto;
        overscroll-behavior: contain;
    }
    .guest-action-panel::backdrop { background: #20383166; }
    .guest-action-header { position: sticky; top: 0; z-index: 1; margin: 0 0 8px; padding: 22px 4px 18px; background: #fff; }
    .guest-action-header > div > span { font-size: 11px; }
    .guest-action-header h3 { margin-top: 5px; color: #293c34; font-size: 18px; line-height: 1.5; }
    .guest-actions-close { min-height: 44px; padding: 10px 12px; font-size: 12px; border-radius: 10px; }
    .guest-actions-close .icon { width: 16px; height: 16px; }
    .guest-action-group { gap: 4px; }
    .guest-action-panel .guest-menu-item { min-height: 68px; gap: 13px; padding: 12px 10px; border-radius: 12px; font-size: 14px; line-height: 1.5; }
    .guest-action-panel .guest-menu-item > .icon { width: 36px; height: 36px; padding: 9px; border-radius: 10px; background: #eef4eb; color: #52734f; }
    .guest-menu-copy { gap: 3px; }
    .guest-menu-copy small { display: block; color: #7b8976; font-size: 11px; line-height: 1.6; }
    .guest-sensitive-actions { margin-top: 8px; padding-top: 8px; }
    .guest-action-panel .guest-menu-danger > .icon { background: #faede9; color: #a55246; }
}
.invitation-qr-card { display: flex; align-items: center; gap: 28px; padding: 24px; margin-bottom: 24px; }
.guest-access-screen { min-height: 100svh; display: grid; place-items: center; padding: 24px; background: radial-gradient(ellipse at 15% 15%, #e3ecdc 0, transparent 55%), radial-gradient(ellipse at 85% 85%, #e9e2d7 0, transparent 55%), #f5f6ef; }
.guest-access-dialog { width: min(100%, 440px); padding: 36px; border: 1px solid #e2e7db; border-radius: 24px; background: #fffefb; box-shadow: 0 24px 90px #344c3826; text-align: center; }
.guest-access-icon { display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto 22px; border: 1px solid #dbe5d2; border-radius: 50%; background: #edf2e5; color: #587765; }
.guest-access-icon .icon { width: 25px; height: 25px; }
.guest-access-dialog h1 { font-size: clamp(30px, 7vw, 38px); line-height: 1.3; margin: 0 0 14px; }
.guest-access-dialog > p:not(.eyebrow) { color: #73816d; font-size: 13px; line-height: 1.8; }
.guest-access-dialog .form-stack { margin-top: 26px; gap: 10px; text-align: left; }
.guest-access-dialog .form-stack label { font-weight: 600; }
.guest-access-dialog input { min-height: 48px; font-size: 16px; }
.guest-access-dialog .form-stack > .button { width: 100%; min-height: 48px; margin-top: 4px; }
.guest-access-dialog .guest-access-hint { margin-top: 22px; font-size: 11px; }
.guest-access-dialog .field-error { font-size: 12px; }
@media (max-width: 480px) {
    .guest-access-screen { padding: 18px; }
    .guest-access-dialog { padding: 30px 24px; }
}
.invitation-qr-card > img { flex-shrink: 0; max-width: 100%; height: auto; }
.invitation-qr-card > div { min-width: 0; flex: 1; }
.invitation-qr-card h3 { margin: 0 0 8px; }
.invitation-qr-card p { line-height: 1.7; }
.invitation-qr-card .button-row { flex-wrap: wrap; }
@media (max-width: 640px) {
    .invitation-qr-card { flex-direction: column; align-items: stretch; padding: 20px; gap: 16px; }
    .invitation-qr-card > img { align-self: center; }
}
