#navbar { position:fixed!important; top:0!important; left:0; width:100%; z-index:40; transform:none!important; }
.design-preview { display:block; width:100%; padding:0; border:0; background:transparent; cursor:pointer; }
.design-actions { flex-wrap:wrap; }
.page-edit-button { display:inline-block; margin:8px; padding:7px 12px; border:1px solid #817264; background:#f7f1e8; color:#352b23; font:12px Arial,sans-serif; cursor:pointer; }
.storage-image-button { display:inline-block; padding:10px 14px; border:1px solid #817264; border-radius:8px; background:#817264; color:#fff; font:11px Arial,sans-serif; cursor:pointer; }
.storage-image-button:hover { background:#706254; }
.storage-file-input { display:none; }
.content-sheet { width:min(900px,94vw); max-height:85dvh; overflow:auto; padding:24px; background:#f7f1e8; color:#352b23; border:1px solid #817264; }
.content-sheet::backdrop { background:#352b23aa; }
.sheet-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.sheet-grid img { width:100%; max-height:60vh; object-fit:contain; }
.content-sheet h2 { font:32px Georgia,serif; margin:16px 0; }
.content-sheet p { margin:14px 0; white-space:pre-wrap; }
.content-sheet label { display:block; margin:12px 0; }
.content-sheet input:not([type=checkbox]), .content-sheet textarea { display:block; width:100%; box-sizing:border-box; padding:10px; border:1px solid #817264; color:#352b23; background:white; }
.content-sheet button { padding:10px 14px; margin:6px 6px 6px 0; border:1px solid #817264; cursor:pointer; }
.sheet-close { float:right; }
@media(max-width:650px) { .sheet-grid { grid-template-columns:1fr; } .sheet-grid img { max-height:35vh; } }

/* Shared warm palette for the catalog, booking flow and administration. */
.btn-primary-action, .design-add, .storage-image-button,
.cal-day.cal-selected, #admin-container .cal-day.cal-selected, .slot-btn.selected {
    background:#d3c3b1!important; color:#3d342c!important; border-color:#c4b29e!important;
}
.btn-primary-action:hover, .design-add:hover, .storage-image-button:hover {
    background:#c4b29e!important; color:#302b25!important;
}
.design-actions .design-book { background:transparent!important; }
input[type=checkbox], input[type=radio] { accent-color:#817264; }
.text-stone-400 { color:#817264!important; }
/* Background sampled from the paper in the available design illustrations. */
:root { --page-background:#eeebe4; --ivory:#eeebe4; --paper:#f7f5f0; --beige-soft:#e8e5de; --ink:#302b25; --muted-ink:#6c6256; --line:rgba(87,68,44,.22); }
body, #landing-container main > section, #admin-container, #login-container { background:var(--page-background)!important; }
#navbar, #mobileMenu, #site-footer { background:var(--paper)!important; color:var(--ink)!important; }
#mobileMenu a, #mobileMenu .text-bone { color:var(--ink)!important; }
.action-card, .bank-card, .content-sheet, .selected-designs, .page-edit-button { background:var(--paper)!important; }
input:not([type=checkbox]):not([type=radio]), textarea, select, .content-sheet input:not([type=checkbox]), .content-sheet textarea { background:var(--paper)!important; color:var(--ink); }
#disenos::before { content:'DISEÑOS'; }
#disenos > div > div:first-child { margin-bottom:32px!important; }
#disenos > div > div:first-child p { margin-top:18px!important; }
.catalog-toolbar { gap:20px; flex-wrap:wrap; scroll-margin-top:110px; }
.catalog-sort { display:flex; align-items:center; gap:12px; font-size:13px; }
.catalog-sort select { padding:12px; border:1px solid var(--line); border-radius:6px; min-height:44px; max-width:100%; }
.design-card { display:flex; flex-direction:column; border-radius:10px; background:var(--paper); }
.design-card img { height:auto; object-fit:contain; background:var(--paper); }
.design-card-footer { flex:1; display:flex; flex-direction:column; align-items:stretch; gap:18px; padding:18px; }
.design-summary { flex:1; min-width:0; }
.design-summary h3 { margin:10px 0; font:24px/1.25 Georgia,serif; overflow-wrap:anywhere; }
.design-description { font-size:13px; line-height:1.65; color:var(--muted-ink); display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.design-price { margin-top:16px; font-size:16px; font-weight:600; }
.design-actions .design-add { min-height:44px; border-radius:4px; }
.catalog-pagination { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:20px; margin-top:36px; font-size:14px; }
.catalog-pagination button { padding:12px 18px; min-height:44px; border:1px solid var(--line); border-radius:6px; background:var(--paper); }
button:disabled { opacity:.45; cursor:not-allowed; }
:focus-visible { outline:2px solid #817264; outline-offset:4px; }
.catalog-empty { grid-column:1/-1; padding:32px; text-align:center; }
#admin-container .bg-panel, #admin-container .cal-day, .bank-row button { background:var(--paper)!important; }
#receipt-modal input[type=file] { background:var(--paper)!important; }
@media(max-width:520px) { .catalog-sort { width:100%; flex-wrap:wrap; } .catalog-sort select { flex:1; } .catalog-pagination { gap:10px; font-size:12px; } .catalog-pagination button { padding:12px; } }
@media(max-width:767px) {
    #navbar { height:76px!important; flex-direction:row!important; justify-content:space-between!important; }
    #navbar > a { margin:0!important; font-size:18px!important; }
    #navbar > div:first-child { display:none; }
    #mobileBtn { position:static!important; display:block!important; min-height:44px; padding:10px; font-size:14px; }
    #mobileBtn i { display:none; }
}
@media(prefers-reduced-motion:reduce) { *, *::before, *::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }

/* One navigation menu on desktop, tablet and mobile. */
#navbar { height:88px!important; flex-direction:row!important; justify-content:space-between!important; }
#navbar > div { display:none!important; }
#navbar > a { margin:0!important; }
#mobileBtn { position:static!important; display:flex!important; align-items:center; justify-content:center; width:48px; height:48px; padding:10px; border:1px solid var(--line); border-radius:8px; color:var(--ink); }
#mobileBtn:hover, #mobileBtn[aria-expanded=true] { background:var(--beige-soft); }
#mobileMenu { inset:96px 24px auto auto; width:min(340px,calc(100vw - 32px)); max-height:calc(100dvh - 112px); overflow-y:auto; align-items:stretch; justify-content:flex-start; gap:0; padding:12px; border:1px solid var(--line); border-radius:12px; box-shadow:0 18px 48px rgba(70,55,40,.16); font:15px/1.4 Inter,Arial,sans-serif; }
#mobileMenu a, #mobileMenu > button:not(.menu-close) { margin:0; padding:12px 16px; min-height:44px; border-radius:6px; text-align:left; }
#mobileMenu a:hover, #mobileMenu > button:hover { background:var(--beige-soft); }
#mobileMenu .menu-close { align-self:flex-end; padding:2px 12px; min-height:36px; }
#mobileMenu > button:last-child { border-top:1px solid var(--line); margin-top:8px; border-radius:0; }
@media(max-width:767px) { #navbar { height:76px!important; } #mobileMenu { top:84px; right:16px; max-height:calc(100dvh - 100px); } }
