@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;1,500&display=swap');:root{--navy:#111b3b;--indigo:#29366a;--cream:#f8f5ef;--ink:#1a2343;--muted:#75809a;--line:#e7e8ee;--gold:#b69461}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font:15px 'DM Sans',Arial,sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.hidden{display:none!important}.header{height:78px;padding:0 max(24px,calc((100vw - 1080px)/2));display:flex;align-items:center;justify-content:space-between;background:var(--navy);color:#fff}.brand{display:flex;align-items:center;gap:11px;font-size:21px;font-weight:700;letter-spacing:.18em}.brand small{font-size:8px;letter-spacing:.23em;display:block;color:#b6bfd7;margin-top:5px}.brand-mark{font-size:27px;color:#d1ad73}.header-right{display:flex;align-items:center;gap:12px}.soft{border:1px solid #ffffff50;background:transparent;color:inherit;border-radius:9px;padding:9px 14px;display:inline-block}.admin-link{font-size:21px;opacity:.8}.hero{min-height:302px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 90% 90%,#465892,transparent 55%),linear-gradient(125deg,#111b3b,#293a73);color:#fff;text-align:center;padding:65px 20px 58px}.hero:before,.hero:after{content:'';position:absolute;border:1px solid #ffffff21;border-radius:50%;width:400px;height:400px;right:-110px;bottom:-310px}.hero:after{width:560px;height:560px;right:-190px;bottom:-395px}.hero .eyebrow{color:#cfb587}.eyebrow{font-size:10px;letter-spacing:.25em;font-weight:700}.eyebrow.dark{color:var(--gold)}.hero h1{font:500 clamp(38px,6vw,62px) 'Playfair Display',serif;margin:12px 0}.hero h1 em{color:#dfc398}.hero p{color:#e1e5f0;margin:0}.hero-graphic{position:absolute;right:14%;top:45px;font-size:70px;color:#ffffff1c}.content{max-width:1020px;margin:auto;padding:48px 24px 80px}.menu-head,.section-head,.dash-head{display:flex;align-items:center;justify-content:space-between;gap:20px}.menu-head h2,.admin-main h1{font:500 37px 'Playfair Display',serif;margin:8px 0 25px}.count{color:var(--muted);font-size:12px}.search{background:#fff;border:1px solid var(--line);border-radius:12px;display:flex;align-items:center;padding:0 17px;gap:12px;color:var(--muted);font-size:27px}.search input{width:100%;padding:17px 0;border:0;outline:0;background:transparent;font-size:14px}.categories{display:flex;overflow-x:auto;gap:10px;padding:24px 0;scrollbar-width:thin}.chip{white-space:nowrap;border:1px solid #dce0e9;background:white;border-radius:99px;padding:10px 19px;color:#3a4563}.chip.selected{background:var(--navy);color:#fff;border-color:var(--navy)}.products{display:grid;grid-template-columns:1fr 1fr;gap:16px}.product{background:white;border:1px solid var(--line);border-radius:16px;display:flex;align-items:center;gap:15px;padding:13px;min-height:128px}.product img,.product-placeholder{width:100px;height:100px;flex-shrink:0;object-fit:cover;border-radius:10px}.product-placeholder{display:flex;align-items:center;justify-content:center;background:linear-gradient(130deg,#e7eaf5,#f0e9dd);font-size:40px;color:#8190b4}.product-details{flex:1;min-width:0}.product-details h3{font-size:15px;margin:0 0 6px}.product-details p{font-size:12px;color:var(--muted);line-height:1.55;margin:0}.price{font-size:16px;font-weight:700;color:var(--indigo);align-self:flex-start;white-space:nowrap}.price small{font-size:10px;font-weight:500}.unavailable{display:inline-block;font-size:10px;background:#f7e5db;color:#9f532a;border-radius:5px;margin-top:8px;padding:4px 7px}.state{grid-column:1/-1;text-align:center;padding:70px 15px;color:var(--muted);border:1px dashed #cbd0db;border-radius:12px}footer{text-align:center;color:#bdc4d4;background:var(--navy);padding:38px 12px;letter-spacing:.17em;font-size:12px}footer span{color:var(--gold)}footer small{letter-spacing:0;display:block;margin-top:12px;font-size:11px}.admin-main{max-width:1100px;margin:40px auto 100px;padding:0 24px}.admin-card{background:white;border:1px solid var(--line);border-radius:17px;padding:26px;margin-bottom:24px}.admin-card h2,.section-head h2{margin:0 0 15px;font-size:19px}.admin-card p{color:var(--muted);line-height:1.6}.admin-card#login{max-width:450px;margin:75px auto}.admin-main h1{margin-bottom:10px}.dash-head{margin-bottom:28px}.dash-head p{margin:0;color:var(--muted)}.primary,.secondary{border:0;border-radius:9px;padding:12px 18px;font-weight:600}.primary{background:var(--navy);color:white}.secondary{background:#eef0f6;color:var(--ink)}button:disabled{opacity:.55;cursor:wait}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:24px}.stat{background:#fff;padding:24px;border:1px solid var(--line);border-radius:12px}.stat strong{font-size:32px;display:block}.stat span{font-size:12px;color:var(--muted)}input,select,textarea{border:1px solid #dce0e9;border-radius:9px;padding:12px;background:#fff;color:var(--ink);width:100%;outline-color:var(--indigo)}label{display:block;font-size:12px;font-weight:600;margin:13px 0}label input,label textarea,label select{display:block;margin-top:7px}.inline-form{display:flex;gap:8px}.inline-form input{min-width:145px}.category-row,.admin-product{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:14px 0;gap:12px}.category-row small{color:var(--muted);margin-left:6px}.text-button{border:0;background:none;color:var(--indigo);padding:7px}.danger{color:#ab4141}.admin-product-image{height:56px;width:56px;display:grid;place-items:center;background:#eef0f6;border-radius:8px;color:#98a3bc}.admin-product-image img{width:56px;height:56px;object-fit:cover;border-radius:8px}.admin-product-info{flex:1;min-width:0}.admin-product-info strong,.admin-product-info small{display:block}.admin-product-info small{color:var(--muted);margin:4px 0}.status{font-size:10px;color:#855e22;background:#fff2d2;display:inline-block;padding:4px 8px;border-radius:5px}.status.live{color:#2e755a;background:#e1f5eb}.admin-product-actions{display:flex;gap:6px}dialog{border:0;border-radius:16px;padding:0;max-width:570px;width:calc(100% - 24px);box-shadow:0 25px 90px #0005}dialog::backdrop{background:#111b3bb8}.dialog-body{padding:25px;max-height:85vh;overflow:auto}.dialog-body h2{margin:0}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.toggle{display:flex;gap:9px;align-items:center}.toggle input{width:auto;margin:0;accent-color:var(--indigo)}.photo-preview img{width:110px;height:85px;object-fit:cover;border-radius:8px}.form-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:25px}.error{color:#ab4141!important;font-size:13px}.section-head{margin-bottom:14px}.section-head h2{margin:0}@media(max-width:720px){.header{padding:0 18px;height:69px}.brand{font-size:17px}.hero{padding:57px 15px;min-height:260px}.hero-graphic{right:5%;top:15px}.content{padding:34px 16px 65px}.products{grid-template-columns:1fr}.product{gap:12px}.product img,.product-placeholder{width:86px;height:86px}.price{font-size:14px}.menu-head h2{font-size:32px}.admin-main{padding:0 14px;margin-top:22px}.admin-card{padding:17px}.dash-head,.section-head{flex-wrap:wrap}.stats{gap:7px}.stat{padding:14px}.stat strong{font-size:24px}.stat span{font-size:10px}.inline-form{width:100%}.inline-form input{min-width:0}.admin-product-actions{flex-direction:column}.two{grid-template-columns:1fr}}

.brand-logo{height:65px;width:126px;object-fit:cover;object-position:center;mix-blend-mode:screen;border-radius:4px}.brand-label{font-size:16px}.brand-label small{font-size:8px}.product img{background:#ede8e1}.hero{background:linear-gradient(125deg,#0a1a35,#263967)}@media(max-width:720px){.brand-logo{height:48px;width:88px}.brand-label{font-size:13px}.brand-label small{font-size:7px}}


/* Navy Coffee & Bites — November 2026 rebrand */
:root{--navy:#06162f;--indigo:#103765;--cream:#f8f7f3;--ink:#10223a;--muted:#64758a;--line:#e1e8ef;--gold:#9ebbd8}
.header{height:86px;background:linear-gradient(112deg,#031026 0%,#071b39 53%,#123d6c 100%);border-bottom:1px solid #ffffff24}
.brand{gap:12px;letter-spacing:.13em}
.brand-logo{height:61px;width:65px;object-fit:contain;mix-blend-mode:normal;border-radius:0}
.brand-label{font-family:Georgia,'Times New Roman',serif;font-size:24px;letter-spacing:.15em}
.brand-label small{font-family:'DM Sans',Arial,sans-serif;font-size:9px;letter-spacing:.2em;color:#d3e0ee}
.hero{min-height:405px;padding:40px 20px 66px;background:radial-gradient(ellipse at 75% 10%,#1d4b7d80 0%,transparent 53%),radial-gradient(ellipse at 5% 90%,#163d6d77 0%,transparent 60%),linear-gradient(130deg,#041026 5%,#0c2b54 66%,#04152e 100%)}
.hero:before,.hero:after{opacity:.45}
.hero-inner{position:relative;z-index:1;max-width:820px;margin:auto}
.hero-logo{width:205px;height:210px;object-fit:contain;display:block;margin:-25px auto -18px;filter:drop-shadow(0 10px 22px #03102670)}
.hero .eyebrow{font-size:10px;color:#bbd3ee;letter-spacing:.28em}
.hero h1{font-size:clamp(32px,5vw,51px);line-height:1.12;margin:15px 0 13px}
.hero h1 em{color:#d5e5f5}
.hero p{font-size:14px;color:#d7e5f1}
.eyebrow.dark{color:#416e99}
.menu-head h2{color:#0a2345}
.search{border-color:#dfe7ef;box-shadow:0 4px 20px #10376506}
.chip.selected,.primary{background:#0a2c55;border-color:#0a2c55}
.product{box-shadow:0 8px 30px #0a244606}
.price{color:#123e6e}
footer{background:linear-gradient(120deg,#041229,#123760);color:#dce6f3}
footer strong{color:#fff}
footer span{color:#b3cde5}
.admin-body .header{background:linear-gradient(112deg,#031026,#123d6c)}
.admin-main h1{color:#0a2c55}
@media(max-width:720px){.header{height:72px;padding:0 16px}.brand-logo{height:52px;width:48px}.brand-label{font-size:18px;letter-spacing:.09em}.brand-label small{font-size:7.5px;letter-spacing:.09em}.hero{min-height:380px;padding:36px 18px 52px}.hero-logo{width:185px;height:192px;margin:-25px auto -15px}.hero h1{font-size:35px}.hero p{font-size:13px}.header-right{gap:9px}.soft{padding:8px 11px}}


/* Exact-logo presentation and flowing navy header */
.header{position:relative;isolation:isolate;background:linear-gradient(115deg,#04112b 0%,#082955 58%,#0a3161 100%);overflow:hidden}
.header::before{content:"";position:absolute;pointer-events:none;inset:-100px -5% -80px;background:radial-gradient(ellipse 50% 100% at 75% 5%,#24568b65,transparent 68%),radial-gradient(ellipse 45% 100% at 25% 100%,#0b458a70,transparent 70%);z-index:-1}
.brand-logo{filter:drop-shadow(0 2px 8px #00132b50)}
.hero{isolation:isolate;min-height:530px;padding:24px 20px 62px;background:radial-gradient(ellipse 44% 90% at 80% 15%,#12417f 0%,transparent 74%),radial-gradient(ellipse 53% 100% at 12% 85%,#082d67 0%,transparent 74%),linear-gradient(132deg,#031029 0%,#092956 52%,#03112a 100%);overflow:hidden}
.hero:before{content:"";position:absolute;pointer-events:none;width:115%;height:300px;left:-30%;top:-160px;border:0;border-radius:50%;transform:rotate(-12deg);background:linear-gradient(95deg,transparent,#2a5b9a24 55%,transparent);opacity:.8}
.hero:after{content:"";position:absolute;pointer-events:none;width:125%;height:280px;right:-45%;bottom:-185px;border:0;border-radius:45% 55% 0 0;transform:rotate(-10deg);background:linear-gradient(90deg,#0c41836b,#143e7650 70%,transparent);opacity:.7}
.hero-inner{z-index:1}
.hero-logo{display:block;width:min(360px,82vw);height:auto;aspect-ratio:1;margin:-54px auto -34px;object-fit:contain;filter:none;-webkit-mask-image:radial-gradient(ellipse at center,#000 54%,transparent 75%);mask-image:radial-gradient(ellipse at center,#000 54%,transparent 75%)}
.hero .eyebrow{font-size:10px}
.hero h1{margin-top:10px}
@media(max-width:720px){.hero{min-height:465px;padding:20px 14px 49px}.hero-logo{width:min(318px,89vw);height:auto;margin:-45px auto -30px}.hero h1{font-size:33px}}

/* Compact Navy Coffee & Bites header, using the exact approved full logo */
.header{height:124px;min-height:124px;background:radial-gradient(ellipse 50% 90% at 78% 8%,#1a4679 0%,transparent 80%),linear-gradient(115deg,#03132f 0%,#092b58 55%,#061b3a 100%);border-bottom:0}
.header::before{inset:0;background:radial-gradient(ellipse 55% 150% at 65% 160%,#134d8960,transparent 70%);z-index:-1}
.brand{height:100%;min-width:0;display:flex;align-items:center;gap:0;overflow:hidden}
.brand-logo-full{width:232px!important;height:124px!important;max-width:45vw;object-fit:contain;mix-blend-mode:screen;filter:none;-webkit-mask-image:radial-gradient(ellipse 58% 52% at center,#000 58%,transparent 99%);mask-image:radial-gradient(ellipse 58% 52% at center,#000 58%,transparent 99%)}
.content{padding-top:36px}
@media(max-width:720px){
.header{height:94px;min-height:94px;padding:0 14px}
.brand-logo-full{width:166px!important;height:94px!important;max-width:56vw}
.content{padding-top:27px}
}


/* Navy Hotel brand lockup: sail left, words to its right */
.brand{gap:14px;overflow:visible}
.brand-sail{width:88px!important;height:98px!important;max-width:none;object-fit:contain;flex-shrink:0;mix-blend-mode:normal;filter:none}
.navy-wordmark{display:flex;flex-direction:column;justify-content:center;gap:7px;white-space:nowrap}
.navy-wordmark strong{font-family:Georgia,'Times New Roman',serif;color:#fff;font-weight:500;font-size:clamp(21px,2.4vw,33px);line-height:1;letter-spacing:.075em}
.navy-wordmark small{font-family:'DM Sans',Arial,sans-serif;font-size:clamp(9px,.95vw,12px);font-weight:600;color:#dce8f5;letter-spacing:.24em}
@media(max-width:720px){.brand{gap:7px}.brand-sail{width:53px!important;height:67px!important}.navy-wordmark{gap:5px}.navy-wordmark strong{font-size:clamp(15px,4vw,21px);letter-spacing:.025em}.navy-wordmark small{font-size:8px;letter-spacing:.085em}.header-right{gap:7px}}


/* User-provided Navy logo crops, traced into scalable transparent vectors */
.header{height:112px;min-height:112px}
.brand{display:flex;align-items:center;gap:9px;height:100%;overflow:visible}
.brand-sail-exact{display:block;width:103px;height:92px;object-fit:contain;flex:none}
.brand-lettering-exact{display:block;width:244px;height:89px;object-fit:contain;flex:none}
@media(max-width:720px){
 .header{height:79px;min-height:79px;padding:0 12px}
 .brand{gap:4px}
 .brand-sail-exact{width:60px;height:65px}
 .brand-lettering-exact{width:158px;height:63px}
 .header-right{gap:8px}
 .header-right .soft{padding:7px 8px}
}
@media(max-width:355px){.brand-sail-exact{width:48px}.brand-lettering-exact{width:133px}}


/* The TWO header elements use the ORIGINAL unaltered uploaded image file.
   Cropping is CSS-only; no tracing or image processing. */
.brand{gap:10px}
.brand-original-sail,.brand-original-wordmark{display:block;flex-shrink:0;background-image:url('/assets/navy-coffee-logo-exact.webp?v=4');background-repeat:no-repeat;mix-blend-mode:screen}
.brand-original-sail{width:110px;height:96px;background-size:225px 225px;background-position:-59px -24px}
.brand-original-wordmark{width:257px;height:91px;background-size:342px 342px;background-position:-43px -178px}
@media(max-width:720px){
.brand{gap:4px}
.brand-original-sail{width:68px;height:61px;background-size:139px 139px;background-position:-36px -15px}
.brand-original-wordmark{width:155px;height:55px;background-size:206px 206px;background-position:-26px -107px}
}
@media(max-width:355px){
.brand-original-sail{width:53px;height:49px;background-size:110px 110px;background-position:-29px -12px}
.brand-original-wordmark{width:129px;height:47px;background-size:172px 172px;background-position:-22px -90px}
}


/* Single-piece header exactly as in supplied reference: all branding
   is artwork inside the banner. Only buttons sit above the banner. */
.header{
  height:132px!important;min-height:132px!important;
  padding:0 max(24px,calc((100vw - 1080px)/2))!important;
  background-color:#011b4b!important;
  background-image:url('/assets/navy-header-reference.png?v=1'),linear-gradient(115deg,#001234,#011b4b)!important;
  background-position:left center,left center!important;
  background-size:auto 100%,cover!important;
  background-repeat:no-repeat!important;
}
.header::before{display:none!important}
.header .banner-brand{display:block;flex:0 0 415px;height:100%;z-index:1}
.header .header-right{position:relative;z-index:2}
@media(max-width:720px){
  .header{height:86px!important;min-height:86px!important;padding:0 13px!important;background-size:auto 100%,cover!important}
  .header .banner-brand{flex-basis:min(68vw,275px)}
}
@media(max-width:390px){
  .header .banner-brand{flex-basis:58vw}
  .header-right .soft{padding:7px 9px}
}

/* Original user-supplied transparent logo, no conversion/cropping */
.header{background-image:radial-gradient(ellipse 55% 130% at 73% 0%,#124b86 0%,transparent 75%),linear-gradient(100deg,#03112e,#082954)!important;}
.header .banner-brand{height:100%;flex:0 1 auto;min-width:0;display:flex;align-items:center;justify-content:flex-start}
.navy-final-logo{height:110px;width:auto;max-width:min(570px,74vw);object-fit:contain;display:block}
@media(max-width:720px){.navy-final-logo{height:70px;max-width:69vw}.header{height:86px!important;min-height:86px!important}}

/* Admin one-click visibility control */
.visibility-button{background:#e7edf5;color:#123d68;border:1px solid #cad9e9;white-space:nowrap}
.visibility-button:hover{background:#d8e6f3}
.visibility-button:disabled{opacity:.5}


/* Category and product ordering controls */
.reorder-controls{display:flex;align-items:center;gap:4px;flex-shrink:0}
.order-btn{display:grid;place-items:center;width:32px;height:34px;padding:0;border:1px solid #d7e1eb;border-radius:8px;background:#f4f8fc;color:#0b3767;font-size:19px;font-weight:700;line-height:1}
.order-btn:hover:not(:disabled){background:#d9e8f7;border-color:#99b4d1}
.order-btn:disabled{opacity:.28;cursor:default}
.category-info{flex:1;min-width:0}
.category-info small{display:block;margin-left:0;margin-top:3px}
.category-actions{display:flex;gap:3px;flex-wrap:wrap}
.admin-group-title{font-size:15px;font-weight:700;color:#123760;margin:24px 0 5px;padding:11px 0;border-bottom:2px solid #e3ecf4}
.admin-product-group:first-child .admin-group-title{margin-top:5px}
.admin-product-info{min-width:90px}
@media(max-width:720px){
 .order-btn{width:28px;height:31px;font-size:17px}
 .reorder-controls{gap:2px}
 .category-row{flex-wrap:nowrap}
 .category-info{font-size:12px}
 .category-actions .text-button{padding:5px;font-size:11px}
 .admin-product{gap:7px}
 .admin-product-image,.admin-product-image img{height:42px;width:42px}
 .admin-product-info strong{font-size:12px}
 .admin-product-actions .secondary{padding:8px 9px;font-size:11px}
}

/* Moving products and deleting a non-empty category */
.move-dialog{max-width:480px;width:calc(100% - 28px)}
.move-dialog p{color:#61738b;line-height:1.6}
.move-dialog #move-error{color:#b43b3b}

/* Safe visual fallback for unavailable external stock photos */
.product img,.admin-product-image img,.photo-preview img{background-color:#082754}
