/* Cardápio (cliente.html) - visual melhorado */
:root{--brand:#FF8C00;--brand2:#D2691E;--bg:#f6f7fb;--text:#1f2937;--muted:#6b7280;--card:#ffffff;--ok:#16a34a;--shadow:0 10px 30px rgba(0,0,0,.08)}
*{box-sizing:border-box}
body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;margin:0;background:var(--bg);color:var(--text)}
.loading,.empty,.error{padding:16px;text-align:center}
.error{color:#b00020}

.header{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);box-shadow:0 2px 16px rgba(0,0,0,.10)}
.header-content{display:flex;align-items:center;gap:12px;padding:12px 16px}
.back-btn{border:0;background:var(--brand);color:#fff;border-radius:12px;padding:8px 12px;font-size:16px;cursor:pointer;box-shadow:0 8px 18px rgba(255,140,0,.28)}
.back-btn:hover{background:var(--brand2)}
.title{font-weight:800;letter-spacing:.2px}

.search-container{padding:12px 16px}
.search-input{width:100%;padding:12px 14px;border:1px solid #e5e7eb;border-radius:14px;outline:none;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.05)}
.search-input:focus{border-color:rgba(255,140,0,.55);box-shadow:0 0 0 4px rgba(255,140,0,.15)}

.categories{display:flex;gap:10px;overflow:auto;padding:0 16px 12px 16px}
.categories::-webkit-scrollbar{height:8px}
.categories::-webkit-scrollbar-thumb{background:rgba(0,0,0,.10);border-radius:999px}

.category-btn{border:1px solid rgba(255,140,0,.65);background:#fff;color:var(--brand);border-radius:999px;padding:9px 14px;white-space:nowrap;cursor:pointer;font-weight:700;transition:transform .15s ease, background .15s ease, color .15s ease}
.category-btn:hover{transform:translateY(-1px)}
.category-btn.active{background:var(--brand);color:#fff;border-color:var(--brand)}

.products{padding:8px 16px 56px 16px}
.products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}

.product-card{background:var(--card);border-radius:16px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}
.product-img{width:100%;height:130px;object-fit:cover;background:#eee}
.product-body{padding:12px;display:flex;flex-direction:column;gap:8px}
.product-name{font-weight:900}
.product-desc{font-size:12px;color:var(--muted);min-height:34px;line-height:1.25}
.product-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px}
.product-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}
.product-price{font-weight:900;color:var(--ok)}
.add-btn{border:0;background:var(--brand);color:#fff;border-radius:12px;padding:10px 12px;cursor:pointer;font-weight:800}
.add-btn:hover{background:var(--brand2)}

.add-btn:disabled{opacity:.55;cursor:not-allowed;background:#bfc5cc}
.add-btn:disabled:hover{background:#bfc5cc}

.details-btn{border:1px solid rgba(0,0,0,.1);background:#fff;color:#111;border-radius:12px;padding:10px 10px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.details-btn:hover{background:#f3f4f6}

.cart-container{position:fixed;right:16px;top:76px;z-index:20}
.cart-btn{border:0;background:var(--brand);color:#fff;border-radius:999px;padding:12px 16px;cursor:pointer;box-shadow:0 10px 24px rgba(255,140,0,.28);font-weight:900}
.cart-count{font-weight:900}

.cart-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.48);z-index:100}
.cart-modal-content{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(560px,92vw);background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 18px 60px rgba(0,0,0,.25)}
.cart-modal-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:linear-gradient(135deg,var(--brand),var(--brand2));border-bottom:1px solid rgba(0,0,0,.08)}
.cart-modal-header h2{margin:0;font-size:18px;color:#fff}
.cart-modal-close{border:0;background:transparent;font-size:28px;cursor:pointer;color:#fff}

.cart-modal-body{padding:14px 16px}
.cart-items{display:flex;flex-direction:column;gap:10px;max-height:320px;overflow:auto}
.cart-item{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid #eee;border-radius:14px;padding:12px}
.cart-item-name{font-weight:900}
.cart-item-price{font-size:12px;color:var(--muted)}
.cart-item-actions{display:flex;align-items:center;gap:8px}
.qty-btn{border:1px solid rgba(255,140,0,.65);background:#fff;color:var(--brand);border-radius:12px;padding:6px 12px;cursor:pointer;font-weight:900}
.qty{min-width:20px;text-align:center;font-weight:900}

.mesa-selection{margin-top:14px}
.mesa-selection h3{margin:0 0 8px 0;font-size:14px;color:#111}
.mesa-select{width:100%;padding:12px 12px;border:1px solid #e5e7eb;border-radius:14px}

.cart-actions{display:flex;gap:10px;margin-top:14px}
.cart-action-btn{flex:1;border:0;border-radius:14px;padding:12px 12px;cursor:pointer;font-weight:900}
.cart-modal-content .cart-action-btn.primary{background:var(--brand);color:#fff}
.cart-modal-content .cart-action-btn.primary:hover{background:var(--brand2)}
.cart-action-btn.secondary{background:#e5e7eb;color:#111}

.cart-action-btn.primary[disabled]{opacity:.7;cursor:not-allowed;filter:saturate(.85)}

.btn-spinner{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.55);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite;vertical-align:-2px;margin-right:8px}
@keyframes spin{to{transform:rotate(360deg)}}

.order-status{margin-top:12px;padding:12px 14px;border-radius:14px;font-weight:900}
.order-status.success{background:rgba(22,163,74,.12);border:1px solid rgba(22,163,74,.35);color:var(--ok)}
.order-status.error{background:rgba(176,0,32,.10);border:1px solid rgba(176,0,32,.25);color:#b00020}

.cart-total{padding:14px 16px;border-top:1px solid #eee;background:#fafafa;display:flex;align-items:center;justify-content:space-between;gap:10px}
.cart-total h3{margin:0;font-size:14px;color:#111}
.cart-total-amount{font-size:18px;font-weight:1000;color:var(--brand)}

/* Modal genérico (mensagens de erro/sucesso) */
.app-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.52);z-index:200}
.app-modal-content{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(520px,92vw);background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 18px 60px rgba(0,0,0,.25)}
.app-modal-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid #eee;background:#fff}
.app-modal-title{font-weight:1000;color:#111}
.app-modal-close{border:0;background:transparent;font-size:28px;cursor:pointer;color:#111;line-height:1}
.app-modal-body{padding:14px 16px;color:var(--text);white-space:pre-line}
.app-modal-actions{padding:14px 16px;border-top:1px solid #eee;display:flex;justify-content:flex-end;background:#fafafa}
.app-modal-btn{border:0;border-radius:14px;padding:10px 16px;cursor:pointer;font-weight:900;background:var(--brand);color:#fff}
.app-modal-btn:hover{background:var(--brand2)}

@media (max-width:420px){
  .products-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
  .cart-container{top:70px;right:12px}
}

@media (max-width:768px){
  .header-content{flex-wrap:wrap;gap:10px}
  .title{font-size:16px}
  .products{padding:8px 12px 80px 12px}
  .products-grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
  .product-img{height:120px}
  .cart-modal-content{width:min(560px,94vw)}
}

@media (max-width:520px){
  .header-content{padding:10px 12px}
  .back-btn{padding:8px 10px;border-radius:10px}
  .search-container{padding:10px 12px}
  .categories{padding:0 12px 10px 12px}
  .products-grid{grid-template-columns:1fr}
  .product-card{border-radius:14px}
  .product-img{height:160px}
  .product-bottom{flex-wrap:wrap;align-items:flex-start}
  .product-actions{width:100%;justify-content:flex-end}

  .cart-container{top:auto;right:12px;bottom:14px}
  .cart-btn{padding:12px 14px}

  .cart-modal-content{left:50%;top:50%;transform:translate(-50%,-50%);width:94vw;max-height:92vh}
  .cart-modal-body{max-height:calc(92vh - 64px - 62px);overflow:auto}
  .cart-items{max-height:none}
}

@media (max-width:360px){
  .product-img{height:140px}
  .details-btn{padding:10px 12px}
  .add-btn{padding:10px 12px}
  .cart-container{right:10px;bottom:12px}
}
