/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* ── Staff Nav ───────────────────────────────────── */
.staff-nav          { display:flex;align-items:center;justify-content:space-between;background:#7a4f2b;padding:0 20px;height:52px;gap:12px }
.staff-nav-links    { display:flex;align-items:center;gap:4px }
.nav-link           { color:rgba(255,255,255,.75);text-decoration:none;font-size:14px;font-weight:600;padding:7px 12px;border-radius:8px;transition:background .15s,color .15s }
.nav-link:hover     { color:#fff;background:rgba(255,255,255,.12) }
.staff-nav-right    { display:flex;align-items:center;gap:10px }
.locale-toggle      { display:flex;border:1.5px solid rgba(255,255,255,.3);border-radius:8px;overflow:hidden }
.locale-btn         { background:transparent;color:rgba(255,255,255,.7);border:none;padding:5px 11px;font-size:13px;font-weight:700;cursor:pointer;line-height:1 }
.locale-btn:hover   { background:rgba(255,255,255,.12);color:#fff }
.locale-btn-active  { background:rgba(255,255,255,.22);color:#fff }
.signout-btn        { background:rgba(255,255,255,.12);color:rgba(255,255,255,.85);border:1.5px solid rgba(255,255,255,.25);padding:6px 14px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer }
.signout-btn:hover  { background:rgba(255,255,255,.2);color:#fff }

/* ── Store Hours ─────────────────────────────────── */
.wrap           { background:#f4efe7;border-radius:14px;padding:16px }
.topbar         { display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;flex-wrap:wrap;gap:10px }
.pg-title       { font-size:20px;font-weight:700;color:#2b2b2b }
.pg-sub         { font-size:13px;color:#9b8a6e;margin-top:2px }
.save-btn       { background:#7a4f2b;color:#fff;border:none;padding:11px 22px;border-radius:10px;font-size:14px;font-weight:700;cursor:pointer }
.info-strip     { display:flex;align-items:center;gap:8px;background:#faf3e9;border-radius:8px;padding:10px 14px;font-size:13px;color:#7a4f2b;margin-bottom:14px }
.section-card   { background:#fff;border-radius:12px;border:1px solid #e3d9c8;margin-bottom:14px;overflow:hidden }
.section-head   { padding:13px 16px;border-bottom:1px solid #ede5d8;display:flex;align-items:center;justify-content:space-between }
.section-head-title { font-size:14px;font-weight:700;color:#2b2b2b }
.section-head-sub   { font-size:12px;color:#9b8a6e;margin-top:2px }
.day-row        { display:flex;align-items:center;gap:14px;padding:12px 16px;border-bottom:1px solid #f0e9dd }
.day-row:last-child { border-bottom:none }
.day-row.closed-row { background:#fafaf8 }
.day-name       { font-size:14px;font-weight:700;color:#2b2b2b;width:96px;flex:0 0 auto }
.day-row.closed-row .day-name { color:#b0a898 }
.toggle         { width:40px;height:22px;border-radius:11px;background:#7a4f2b;position:relative;cursor:pointer;flex:0 0 auto;display:inline-block }
.toggle .knob   { width:16px;height:16px;border-radius:50%;background:#fff;position:absolute;top:3px;right:3px }
.toggle.off     { background:#d0c8bc }
.toggle.off .knob { left:3px;right:auto }
.sr-only        { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0 }
.time-range     { display:flex;align-items:center;gap:8px }
.time-in        { border:2px solid #e3d9c8;border-radius:7px;padding:7px 9px;font-size:13px;font-weight:700;color:#2b2b2b;background:#fdfbf7;width:78px;text-align:center }
.time-in:disabled { color:#c0b8ae;background:#f5f2ee;cursor:not-allowed }
.sep            { font-size:12px;color:#b08c5e;font-weight:700 }
.closed-pill    { font-size:12px;font-weight:700;color:#9b8a6e;background:#f0ede8;padding:5px 12px;border-radius:20px }
.exc-row        { display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid #f0e9dd }
.exc-row:last-child { border-bottom:none }
.exc-date       { font-size:14px;font-weight:700;color:#2b2b2b;width:140px;flex:0 0 auto }
.exc-weekday    { font-size:11px;color:#9b8a6e;font-weight:500;display:block;margin-top:1px }
.exc-reason     { flex:1;font-size:13px;color:#555;font-style:italic }
.closed-tag     { font-size:12px;font-weight:700;color:#c62828;background:#fdecea;padding:4px 10px;border-radius:6px }
.hours-tag      { font-size:12px;font-weight:700;color:#7a4f2b;background:#faf3e9;padding:4px 10px;border-radius:6px }
.del-btn        { width:28px;height:28px;border-radius:50%;border:none;background:#fdecea;color:#c62828;cursor:pointer;font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center;flex:0 0 auto;transition:background .15s }
.del-btn:hover  { background:#f5c6c6 }
.add-exc-row    { display:flex;align-items:center;gap:10px;padding:12px 16px;flex-wrap:wrap;background:#fdfbf7;border-top:1px solid #ede5d8 }
.date-in        { border:2px solid #e3d9c8;border-radius:7px;padding:8px 10px;font-size:13px;color:#2b2b2b;background:#fff }
.reason-in      { border:2px solid #e3d9c8;border-radius:7px;padding:8px 10px;font-size:13px;color:#2b2b2b;background:#fff;flex:1;min-width:140px }
.type-sel       { display:flex;gap:6px }
.type-opt       { padding:5px 12px;border:1.5px solid #d8cbbA;border-radius:20px;font-size:12px;font-weight:600;cursor:pointer;color:#a0917e;background:#faf8f5 }
.type-opt.sel   { border-color:#7a4f2b;background:#7a4f2b;color:#fff }
.type-opt input { display:none }
.add-btn-sm     { background:#7a4f2b;color:#fff;border:none;padding:8px 14px;border-radius:7px;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap }
.form-errors    { padding:8px 16px;color:#c62828;font-size:13px }
.flash-notice   { background:#e8f5e9;color:#2e7d32;padding:10px 16px;border-radius:8px;margin:8px 0;font-size:14px }
.flash-alert    { background:#fdecea;color:#c62828;padding:10px 16px;border-radius:8px;margin:8px 0;font-size:14px }

/* ── Product Catalog ─────────────────────────────── */
.add-btn          { background:#7a4f2b;color:#fff;border:none;padding:10px 18px;border-radius:10px;font-size:14px;font-weight:700;cursor:pointer }
.add-btn:hover    { background:#5c3a1f }
.prod-list        { background:#fff;border-radius:12px;overflow:hidden;border:1px solid #e3d9c8;margin-bottom:14px }
.prod-row         { border-bottom:1px solid #ede5d8 }
.prod-row:last-child { border-bottom:none }
.prod-main        { display:flex;align-items:center;gap:14px;padding:13px 16px }
.photo-cell       { width:52px;height:52px;border-radius:9px;background:#efe2cd;display:flex;align-items:center;justify-content:center;font-size:24px;flex:0 0 auto;overflow:hidden }
.photo-cell.empty { border:2px dashed #c8b89a;font-size:12px;color:#c8b89a;text-align:center;line-height:1.3 }
.photo-upload-form { flex:0 0 auto }
.photo-cell        { cursor:pointer }
.photo-cell:hover  { opacity:.8 }
.prod-photo       { width:52px;height:52px;object-fit:cover;border-radius:9px }
.prod-name        { flex:1;font-size:15px;font-weight:700;color:#2b2b2b }
.prod-name.inactive { color:#9b8a6e }
.inactive-badge   { font-size:11px;font-weight:400;color:#9b8a6e;margin-left:4px }
.day-pills        { display:flex;gap:4px }
.dp               { width:26px;height:26px;border-radius:6px;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;background:#f0ede8;color:#b0a898 }
.dp.on            { background:#7a4f2b;color:#fff }
.row-actions      { display:flex;gap:6px;flex:0 0 auto;align-items:center }
.icon-btn         { width:34px;height:34px;border-radius:7px;border:1px solid #e3d9c8;background:#fff;color:#6b5d45;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;line-height:1 }
.icon-btn.danger  { color:#c62828;border-color:#fca08a }
.icon-btn.danger:hover { background:#fdecea }
.prod-detail      { background:#faf3e9;border-top:1px solid #e8ddd0;padding:14px 16px 16px }
.detail-label     { font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:#b08c5e;margin-bottom:6px;display:block }
.day-grid         { display:flex;gap:8px;flex-wrap:wrap;margin-bottom:4px }
.day-toggle       { display:flex;flex-direction:column;align-items:center;gap:5px }
.day-label        { font-size:11px;font-weight:700;color:#9b8a6e }
.day-box          { width:38px;height:38px;border-radius:9px;border:2px solid #e3d9c8;background:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#9b8a6e;cursor:pointer }
.day-box.checked  { background:#7a4f2b;border-color:#7a4f2b;color:#fff }
.day-box.closed-day { background:#f0ede8;border-color:#e3d9c8;color:#ccc;cursor:not-allowed }
.detail-row       { display:flex;align-items:flex-end;gap:20px;flex-wrap:wrap }
.detail-field     { display:flex;flex-direction:column;gap:4px }
.name-in          { border:2px solid #e3d9c8;border-radius:7px;padding:8px 10px;font-size:14px;font-weight:600;color:#2b2b2b;background:#fdfbf7;min-width:160px }
.num-in           { border:2px solid #e3d9c8;border-radius:7px;padding:7px 9px;font-size:13px;font-weight:700;color:#2b2b2b;background:#fdfbf7;width:70px;text-align:center }
.photo-in         { font-size:12px;color:#6b5d45 }
.form-actions     { display:flex;align-items:center;gap:10px;padding:12px 16px;background:#faf3e9;border-top:1px solid #ede5d8 }
.cancel-btn       { background:transparent;border:1.5px solid #c8b89a;color:#6b5d45;padding:8px 16px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer }
.cancel-btn:hover { background:#f0ede8 }
.row-actions form { display:inline }
.mt-14            { margin-top:14px }

/* Day view */
.empty-msg        { padding:16px;color:#9b8a6e;font-size:13px }

.day-product-row  { display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:1px solid #f0e8da }
.day-product-row:last-child { border-bottom:none }
.day-prod-photo   { flex-shrink:0 }
.day-prod-img     { width:40px;height:40px;object-fit:cover;border-radius:8px }
.day-prod-img-placeholder { width:40px;height:40px;border-radius:8px;background:#ede5d8 }
.day-prod-info    { flex:1;min-width:0 }
.day-prod-name    { font-size:14px;font-weight:600;color:#2b2b2b }
.day-prod-meta    { font-size:12px;color:#9b8a6e;margin-top:2px }
.day-prod-counts  { display:flex;flex-direction:column;align-items:flex-end;gap:4px;min-width:90px }
.day-count        { font-size:13px;font-weight:600;color:#2b2b2b }
.prog-bar         { width:90px;height:6px;background:#ede5d8;border-radius:3px;overflow:hidden }
.prog-fill        { height:100%;background:#7a4f2b;border-radius:3px;transition:width 0.2s }
.prog-fill--warn  { background:#d97706 }
.prog-fill--full  { background:#c62828 }

.day-res-row      { display:flex;gap:12px;padding:10px 16px;border-bottom:1px solid #f0e8da }
.day-res-row:last-child { border-bottom:none }
.day-res-time     { width:44px;flex-shrink:0;font-size:13px;font-weight:600;color:#7a4f2b;padding-top:2px }
.day-res-info     { flex:1 }
.day-res-name     { font-size:14px;font-weight:600;color:#2b2b2b }
.day-res-items    { display:flex;flex-wrap:wrap;gap:6px;margin-top:3px }
.day-res-item     { font-size:12px;color:#6b5d45;background:#f4efe7;border-radius:5px;padding:2px 7px }

/* ── Shared button utilities ── */
.btn              { display:inline-block;border:none;border-radius:8px;font-size:14px;font-weight:700;cursor:pointer;padding:10px 18px;text-decoration:none;text-align:center }
.btn--primary     { background:#7a4f2b;color:#fff }
.btn--primary:hover { background:#5c3a1f }
.btn--primary:disabled { background:#c4a882;cursor:not-allowed }
.btn--sm          { font-size:13px;padding:8px 14px;border-radius:7px }

/* ── New Order Form ── */
.section-body     { padding:12px 16px }
.field-row        { margin-bottom:10px }
.field-row--inline { display:flex;gap:12px }
.field-col        { flex:1 }
.field-label      { display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:600;color:#9b8a6e;text-transform:uppercase;letter-spacing:.3px;margin-bottom:4px }
.field-input,
.field-select     { width:100%;border:1px solid #e3d9c8;border-radius:7px;padding:8px 10px;font-size:13px;color:#2b2b2b;background:#faf8f5;box-sizing:border-box }
.field-input:disabled { background:#f0ede8;color:#9b8a6e }
.name-hint        { font-size:11px;color:#d97706;font-weight:600 }
.name-hint.hidden { display:none }

/* ── Collapsible product sections ── */
.collapsible-head  { display:flex;align-items:center;justify-content:space-between;padding:9px 16px;border-top:1px solid #ede5d8;background:#faf8f5;cursor:pointer;user-select:none }
.collapsible-label { font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:#9b8a6e }
.collapsible-label--warn { color:#d97706 }
.collapsible-toggle { font-size:11px;color:#9b8a6e }
.collapsible-body  { border-top:1px solid #f0e8da }
.collapsible-body.hidden { display:none }

.override-row     { padding:7px 16px;background:#fdf8f2;border-bottom:1px solid #f0e8da }
.override-label   { font-size:11px;color:#92400e;font-weight:600;display:flex;align-items:center;gap:6px;cursor:pointer }
.override-cb      { accent-color:#d97706 }

/* ── Product rows in new order ── */
.order-product-row { display:flex;align-items:center;justify-content:space-between;padding:9px 16px;border-bottom:1px solid #f0e8da }
.order-product-row:last-child { border-bottom:none }
.order-prod-name  { font-size:12px;font-weight:600;color:#2b2b2b }
.order-prod-meta  { font-size:10px;color:#9b8a6e;margin-top:1px }
.order-stepper    { display:flex;align-items:center;gap:7px }
.stepper-btn      { width:26px;height:26px;border-radius:6px;border:none;font-size:14px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center }
.stepper-btn--inc { background:#7a4f2b;color:#fff }
.stepper-btn--dec { background:#f4efe7;color:#7a4f2b }
.stepper-btn:disabled { background:#e5e5e5;color:#aaa;cursor:default }
.stepper-val      { font-size:13px;font-weight:700;min-width:18px;text-align:center;color:#2b2b2b }

/* ── Source radio buttons ── */
.source-btn-group { display:flex;gap:0 }
.source-btn       { display:flex;align-items:center;justify-content:center;padding:7px 18px;font-size:12px;font-weight:600;cursor:pointer;border:1px solid #c4a882;background:#fdf8f2;color:#5c3d1e;transition:background 0.15s,color 0.15s;user-select:none }
.source-btn:first-child { border-radius:6px 0 0 6px }
.source-btn:last-child  { border-radius:0 6px 6px 0;border-left:none }
.source-btn input[type="radio"] { display:none }
.source-btn:has(input:checked) { background:#7a4f2b;color:#fff;border-color:#7a4f2b }

/* ── Splash page ── */
.splash               { min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f4efe7;padding:40px 20px;text-align:center }
.splash-mark          { margin-bottom:32px }
.splash-title         { font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(42px,8vw,80px);font-weight:300;letter-spacing:0.18em;color:#3d2408;margin:0;line-height:1 }
.splash-divider       { display:flex;align-items:center;gap:14px;margin:28px 0 }
.splash-divider-line  { width:clamp(40px,8vw,90px);height:1px;background:#b08c5e }
.splash-divider-leaf  { font-size:12px;color:#b08c5e;line-height:1 }
.splash-tagline       { font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(14px,2.5vw,18px);font-weight:400;font-style:italic;letter-spacing:0.22em;color:#9b8a6e;margin:0 0 24px;text-transform:uppercase }
.splash-soon          { font-family:'Jost','Helvetica Neue',sans-serif;font-size:clamp(10px,1.8vw,13px);font-weight:300;letter-spacing:0.4em;text-transform:uppercase;color:#b08c5e;margin:0 0 28px }
.splash-instagram     { display:inline-flex;align-items:center;gap:8px;color:#9b8a6e;text-decoration:none;transition:color 0.2s }
.splash-instagram:hover { color:#3d2408 }
.splash-instagram span { font-family:'Jost','Helvetica Neue',sans-serif;font-size:12px;font-weight:300;letter-spacing:0.12em }

/* Login page */
.login-page           { min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f4efe7;padding:40px 20px }
.login-mark           { margin-bottom:16px }
.login-mark a         { display:block;opacity:0.85;transition:opacity 0.2s }
.login-mark a:hover   { opacity:1 }
.login-title          { font-family:'Cormorant Garamond',Georgia,serif;font-size:28px;font-weight:300;letter-spacing:0.18em;color:#3d2408;margin:0 0 32px;text-align:center }
.login-form           { width:100%;max-width:320px;display:flex;flex-direction:column;gap:16px }
.login-field          { display:flex;flex-direction:column;gap:6px }
.login-label          { font-family:'Jost','Helvetica Neue',sans-serif;font-size:11px;font-weight:400;letter-spacing:0.12em;text-transform:uppercase;color:#9b8a6e }
.login-input          { font-family:'Jost','Helvetica Neue',sans-serif;font-size:15px;font-weight:300;color:#3d2408;background:#fff;border:1px solid #d4c4a8;border-radius:2px;padding:10px 12px;outline:none;transition:border-color 0.15s }
.login-input:focus    { border-color:#b08c5e }
.login-submit         { font-family:'Jost','Helvetica Neue',sans-serif;font-size:11px;font-weight:400;letter-spacing:0.25em;text-transform:uppercase;color:#f4efe7;background:#3d2408;border:none;border-radius:2px;padding:12px;cursor:pointer;margin-top:8px;transition:background 0.15s }
.login-submit:hover   { background:#5a3510 }
.login-alert          { font-family:'Jost','Helvetica Neue',sans-serif;font-size:13px;color:#a0341a;background:#fdf0ed;border:1px solid #e8c4bb;border-radius:2px;padding:10px 12px;margin:0 }