:root { --ink:#252a24; --sub:#757971; --paper:#f8f7f2; --white:#fff; --line:#e7e8e0; --accent:#b64d4c; --accent-dark:#913c3b; --light-rose:#f8eae6; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font-family:Arial,Helvetica,sans-serif; color:var(--ink); background:var(--paper); font-size:14px; }
a { color:inherit; text-decoration:none; }
button,input,select { font:inherit; }
button { cursor:pointer; }
[hidden] { display:none !important; }
.container { width:min(1180px, calc(100% - 60px)); margin:0 auto; }
.site-header { background:var(--white); border-bottom:1px solid #efefea; }
.header-inner { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand { display:flex; align-items:center; gap:10px; font-size:22px; font-weight:700; letter-spacing:2.8px; }
.brand-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:var(--light-rose); font-size:25px; color:var(--accent); line-height:1; }
.brand-dot,.title-mark { color:var(--accent); }
.nav { display:flex; align-items:center; gap:30px; font-weight:600; font-size:13px; }
.nav a:hover { color:var(--accent); }
.nav .nav-action { padding:12px 17px; border:1px solid var(--accent); border-radius:6px; color:var(--accent); }
.nav .nav-action:hover { background:var(--accent); color:#fff; }
.hero { overflow:hidden; background:#222e26; color:#fff; }
.hero-inner { min-height:247px; display:flex; align-items:center; justify-content:space-between; gap:35px; position:relative; }
.hero-inner:before { content:''; position:absolute; right:-110px; top:-220px; width:500px; height:500px; border:1px solid #ffffff18; border-radius:50%; pointer-events:none; }
.eyebrow,.section-label { font-size:10px; font-weight:700; letter-spacing:2px; }
.eyebrow { display:flex; align-items:center; gap:12px; color:#e5b3aa; }
.small-dash { width:24px; height:1px; background:#e5b3aa; }
h1,h2,h3,p { margin-top:0; }
.hero h1 { font-family:Georgia,'Times New Roman',serif; font-size:clamp(33px,4.1vw,55px); letter-spacing:-1.6px; font-weight:500; line-height:1.1; margin:17px 0; }
.hero h1 em { color:#e6b3a7; font-weight:500; }
.hero-copy { color:#c7d0c8; margin-bottom:0; font-size:14px; }
.hero-stamp { border:1px solid #718277; border-radius:50%; width:145px; height:145px; display:flex; flex-direction:column; align-items:center; justify-content:center; flex-shrink:0; transform:rotate(11deg); gap:3px; }
.hero-stamp span { font-size:52px; line-height:1.1; font-family:Georgia,serif; color:#d6a59c; }
.hero-stamp small { font-size:9px; letter-spacing:3px; text-align:center; line-height:1.5; color:#d6dcd5; }
.content-wrap { padding-top:44px; padding-bottom:100px; min-height:470px; }
.layout { display:grid; grid-template-columns:320px minmax(0,1fr); align-items:start; gap:48px; }
.panel { background:var(--white); border:1px solid var(--line); border-radius:10px; padding:27px; box-shadow:0 12px 35px #252a2408; }
.form-panel { scroll-margin-top:22px; }
.section-label { margin:0 0 12px; color:var(--accent); }
h2 { font-family:Georgia,'Times New Roman',serif; font-size:30px; font-weight:600; letter-spacing:-.8px; margin-bottom:5px; }
.muted { color:var(--sub); line-height:1.5; }
.form-panel > .muted { margin-bottom:28px; }
.dish-form { display:grid; gap:18px; }
.field { display:flex; flex-direction:column; gap:8px; min-width:0; }
.field label { font-size:12px; font-weight:700; }
.field input,.field select { width:100%; min-width:0; min-height:45px; border:1px solid #dedfd7; background:#fff; border-radius:6px; padding:0 12px; color:var(--ink); outline:none; }
.field input:focus,.field select:focus,.filters input:focus,.filters select:focus { border-color:var(--accent); box-shadow:0 0 0 3px #b64d4c16; }
.field input::placeholder { color:#b3b5af; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.btn { appearance:none; border-radius:6px; padding:11px 15px; border:1px solid transparent; font-weight:700; font-size:12px; line-height:1.3; display:inline-flex; gap:8px; align-items:center; justify-content:center; transition:background .15s,border-color .15s,color .15s; white-space:nowrap; }
.btn-primary { background:var(--accent); color:#fff; }
.btn-primary:hover { background:var(--accent-dark); }
.btn-primary span { font-size:16px; }
.btn-outline { color:var(--ink); border-color:#daddd4; background:#fff; }
.btn-outline:hover { border-color:var(--ink); }
.btn-delete { color:var(--accent); border-color:transparent; background:transparent; }
.btn-delete:hover { background:var(--light-rose); }
.full { width:100%; min-height:46px; margin-top:5px; }
.menu-section { min-width:0; scroll-margin-top:22px; }
.menu-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; }
.menu-heading h2 { font-size:36px; }
.menu-heading .muted { margin-bottom:0; }
.filters { display:grid; grid-template-columns:minmax(0,1fr) 185px; gap:12px; margin:25px 0 20px; }
.search-wrap { position:relative; min-width:0; }
.search-wrap > span { position:absolute; left:14px; top:9px; font-size:27px; color:#a6aaa2; line-height:1; }
.filters input,.filters select { width:100%; height:44px; background:#fff; border:1px solid #e1e2db; border-radius:6px; padding:0 13px; color:var(--ink); outline:none; min-width:0; }
.filters input { padding-left:39px; }
.filters input::placeholder { color:#a8ada5; }
.dish-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:17px; }
.dish-card { padding:23px; min-width:0; background:var(--white); border-radius:9px; border:1px solid var(--line); transition:box-shadow .2s,transform .2s; }
.dish-card:hover { box-shadow:0 12px 24px #252a240b; transform:translateY(-2px); }
.card-top { display:flex; align-items:center; justify-content:space-between; }
.chip { border-radius:30px; background:#f5f1eb; color:#81776b; font-size:10px; padding:6px 10px; letter-spacing:.3px; }
.flower { font-size:21px; line-height:1; color:#deb0a9; }
.dish-card h3 { font-family:Georgia,'Times New Roman',serif; font-size:23px; line-height:1.2; font-weight:600; min-height:54px; margin:21px 0 9px; overflow-wrap:anywhere; }
.card-details { display:flex; align-items:center; justify-content:space-between; gap:8px; padding-bottom:22px; }
.price { font-size:18px; font-weight:700; color:var(--accent); }
.stock { font-size:11px; color:var(--sub); white-space:nowrap; }
.card-actions { display:flex; gap:8px; align-items:stretch; padding-top:15px; border-top:1px solid #f0f0eb; }
.card-actions .btn,.card-actions form { flex:1 1 0; min-width:0; }
.card-actions form .btn { width:100%; height:100%; }
.empty-state { padding:40px 15px; border:1px dashed #dadcd4; color:var(--sub); text-align:center; border-radius:8px; background:#fff; }
.notice { border-radius:7px; padding:13px 16px; margin-bottom:22px; border:1px solid; }
.notice.success { color:#365f45; background:#ecf5ee; border-color:#cde3d1; }
.notice.error { color:#8c3735; background:#faebea; border-color:#ebc8c5; }
.footer { border-top:1px solid #e4e5df; background:#fff; }
.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:15px; min-height:72px; font-size:11px; color:#8b9087; }
.footer-inner span:first-child { color:var(--accent); font-weight:700; letter-spacing:1.8px; }
.edit-main { min-height:calc(100vh - 149px); padding:64px 0 100px; }
.edit-container { max-width:640px; }
.edit-container h1 { font-family:Georgia,'Times New Roman',serif; font-size:42px; line-height:1.2; margin:0 0 9px; }
.edit-container > .muted { margin-bottom:27px; }
.edit-panel { padding:32px; }
.edit-actions { display:flex; gap:11px; justify-content:flex-end; flex-wrap:wrap; }
@media (max-width: 1000px) { .layout { grid-template-columns:280px minmax(0,1fr); gap:26px; } .dish-grid { grid-template-columns:1fr; } }
@media (max-width: 700px) { .container { width:min(100% - 32px,550px); } .header-inner { min-height:67px; } .brand { font-size:18px; letter-spacing:1.8px; } .brand-icon { width:30px; height:30px; } .nav { gap:13px; font-size:12px; } .nav .nav-action { padding:10px; } .hero-inner { min-height:220px; } .hero-stamp { display:none; } .hero h1 { font-size:38px; } .content-wrap { padding-top:28px; padding-bottom:65px; } .layout { grid-template-columns:1fr; gap:36px; } .panel { padding:23px; } .form-panel > .muted { margin-bottom:20px; } .dish-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .dish-card { padding:16px; } .dish-card h3 { font-size:21px; } .filters { grid-template-columns:minmax(0,1fr) 160px; } .footer-inner { flex-wrap:wrap; padding:16px 0; min-height:auto; } .edit-main { padding:45px 0 70px; } }
@media (max-width: 530px) { .nav { gap:10px; } .nav a:first-child { display:none; } .hero h1 { font-size:34px; } .filters { grid-template-columns:1fr; } .dish-grid { grid-template-columns:1fr; } .dish-card h3 { min-height:0; margin:20px 0 15px; } .form-row { grid-template-columns:1fr 1fr; } .menu-heading h2 { font-size:32px; } .edit-container h1 { font-size:35px; } .edit-panel { padding:21px; } .edit-actions { flex-direction:column-reverse; } .edit-actions .btn { width:100%; } }

/* Vista del cliente: carta a la izquierda, pedido resumido a la derecha. */
.client-layout { display:grid; grid-template-columns:minmax(0,1fr) 310px; align-items:start; gap:32px; }
.client-layout .menu-section h2 { font-size:35px; }
.order-panel { position:sticky; top:20px; scroll-margin-top:20px; }
.order-panel > .muted { margin-bottom:24px; }
.cart-empty { background:var(--paper); border:1px dashed var(--line); border-radius:6px; color:var(--sub); padding:20px 12px; text-align:center; line-height:1.5; }
.cart-items { display:grid; gap:0; }
.cart-line { display:flex; align-items:center; justify-content:space-between; gap:10px; border-bottom:1px solid var(--line); padding:14px 0; }
.cart-line-info { display:flex; flex-direction:column; gap:6px; min-width:0; }
.cart-line-info strong { font-size:13px; overflow-wrap:anywhere; }
.cart-line-info small { color:var(--sub); }
.quantity-controls { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.quantity-controls button { background:var(--white); border:1px solid var(--line); border-radius:5px; width:27px; height:27px; font-weight:700; }
.quantity-controls button:hover:not(:disabled) { border-color:var(--accent); color:var(--accent); }
.quantity-controls button:disabled { opacity:.4; cursor:not-allowed; }
.quantity-controls span { min-width:12px; text-align:center; font-weight:700; }
.order-total { border-top:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; margin:20px 0; padding-top:17px; font-weight:700; }
.order-total strong { font-size:22px; color:var(--accent); }
.order-panel .dish-form { gap:8px; }
.order-panel .btn:disabled,.client-card .btn:disabled { background:#d2d2cb; cursor:not-allowed; color:#fff; }
.fine-print { color:var(--sub); font-size:11px; line-height:1.5; margin:15px 0 0; }
.orders-main { min-height:calc(100vh - 149px); }
.page-title { font:500 clamp(32px,4vw,46px)/1.2 Georgia,'Times New Roman',serif; letter-spacing:-1px; margin:0 0 12px; }
.order-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-top:30px; }
.received-order { min-width:0; }
.order-heading { display:flex; justify-content:space-between; align-items:start; gap:20px; }
.order-heading h2 { overflow-wrap:anywhere; font-size:26px; }
.order-heading .muted { font-size:12px; margin:8px 0 18px; }
.order-heading .price { white-space:nowrap; }
.order-lines { margin:0; padding:15px 0 0; border-top:1px solid var(--line); list-style:none; }
.order-lines li { display:flex; justify-content:space-between; align-items:baseline; gap:15px; padding:7px 0; line-height:1.4; }
.order-lines li span:last-child { white-space:nowrap; }
@media (max-width:1000px) { .client-layout { grid-template-columns:minmax(0,1fr) 275px; gap:22px; } .client-layout .dish-grid { grid-template-columns:1fr; } }
@media (max-width:700px) { .client-layout { grid-template-columns:1fr; } .client-layout .dish-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .order-panel { position:static; } .order-list { grid-template-columns:1fr; } .header-inner { flex-wrap:wrap; padding:10px 0; } }
@media (max-width:530px) { .client-layout .dish-grid { grid-template-columns:1fr; } .client-layout .menu-section h2 { font-size:31px; } .nav { flex-wrap:wrap; gap:8px 13px; } .received-order { padding:20px; } }

/* Fotografías opcionales: tarjetas sin foto conservan un espacio decorativo. */
/* Todas las fotografias de platillos ocupan un marco de altura fija:
   fotos grandes, horizontales y verticales se muestran uniformes sin deformarse. */
.dish-photo {
    display:block;
    width:100%;
    max-width:100%;
    height:170px;
    max-height:170px;
    object-fit:cover;
    object-position:center;
    border-radius:7px;
    margin:17px 0 0;
    background:#f6f0ed;
}
.dish-photo-empty { display:grid; place-items:center; color:#d7aaa2; font-size:58px; background:linear-gradient(145deg,#fbf5f0,#f2e6e1); }
.dish-photo + h3 { min-height:0; margin-top:16px; }
/* Vista previa en el formulario: muestra la foto entera, sin recortarla. */
.preview-image {
    display:block;
    width:100%;
    max-width:250px;
    height:165px;
    max-height:165px;
    object-fit:contain;
    object-position:center;
    border-radius:7px;
    border:1px solid var(--line);
    background:#f6f0ed;
}
.field input[type=file] { padding:10px; min-height:45px; font-size:12px; }
.inline-check { display:flex; align-items:center; gap:8px; font-size:12px; font-weight:400 !important; }
.inline-check input { width:auto; min-height:auto; }
/* Páginas públicas: mismo diseño Sakura, sin páginas innecesarias. */
.nav a[aria-current=page] { color:var(--accent); }
.home-hero .hero-inner { min-height:365px; }
.home-cta { margin-top:28px; }
.home-section > .muted { margin:12px 0 26px; }
.home-dishes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.home-dishes .dish-card h3 { min-height:0; margin-bottom:10px; }
.home-dishes .price { display:block; margin-bottom:0; }
.home-more { margin-top:28px; }
.page-hero .hero-inner { min-height:220px; }
.about-content { max-width:790px; min-height:380px; }
.about-content h2 { margin-bottom:22px; }
.about-content p:not(.section-label) { font-size:15px; line-height:1.9; }
.contact-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:50px; align-items:start; }
.contact-layout > div > .muted { margin-top:18px; }
.contact-panel { padding:30px; }
.field textarea { width:100%; resize:vertical; min-height:130px; padding:13px; border:1px solid #dedfd7; border-radius:6px; outline:none; font:inherit; color:var(--ink); }
.field textarea:focus { border-color:var(--accent); box-shadow:0 0 0 3px #b64d4c16; }
.form-status { margin:0; line-height:1.5; }
.success-text { color:#365f45; }
.error-text { color:#8c3735; }
.btn:disabled { opacity:.65; cursor:not-allowed; }
@media (max-width:800px) { .contact-layout { grid-template-columns:1fr; gap:18px; } .home-dishes { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:700px) { .public-nav { width:100%; justify-content:space-between; flex-wrap:nowrap; gap:10px; } .public-nav a { font-size:12px; } .home-hero .hero-inner { min-height:280px; } }
@media (max-width:530px) { .public-nav a:first-child { display:inline; } .home-dishes { grid-template-columns:1fr; } .contact-panel { padding:22px; } .dish-photo { height:170px; max-height:170px; } }