/* TecnoBakeSuite - estilos */
:root {
  --tb-primary: #8B4513;
  --tb-secondary: #F4A261;
  --tb-bg: #faf6f1;
  --tb-sidebar-w: 250px;
}
body.tb-app { background: var(--tb-bg); font-size: .92rem; }
.tb-wrapper { display: flex; min-height: 100vh; }
.tb-sidebar {
  width: var(--tb-sidebar-w); flex-shrink: 0; background: #2b1d14; color: #e9dccf;
  position: fixed; top: 0; bottom: 0; left: 0; overflow-y: auto; z-index: 1040; transition: transform .2s;
  display: flex; flex-direction: column;
}
.tb-brand { display: flex; align-items: center; gap: .6rem; padding: 1rem; border-bottom: 1px solid rgba(255,255,255,.08); background: var(--tb-primary); }
.tb-brand img { width: 42px; height: 42px; object-fit: contain; background: #fff; border-radius: 10px; padding: 3px; }
.tb-brand-text { line-height: 1.1; overflow: hidden; }
.tb-brand-text strong { display: block; color: #fff; font-size: .95rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.tb-brand-text small { color: rgba(255,255,255,.75); font-size: .72rem; }
.tb-nav { padding: .5rem 0; flex: 1; }
.tb-link { display: flex; align-items: center; gap: .65rem; padding: .55rem 1rem; color: #e9dccf; text-decoration: none; font-weight: 500; }
.tb-link:hover, .tb-link.active { background: rgba(255,255,255,.08); color: #fff; }
.tb-link.active { border-left: 3px solid var(--tb-secondary); }
.tb-link i:first-child { font-size: 1.1rem; width: 20px; text-align: center; }
.tb-caret { font-size: .7rem; transition: transform .2s; }
.tb-link:not(.collapsed) .tb-caret { transform: rotate(180deg); }
.tb-sublink { display: block; padding: .4rem 1rem .4rem 2.9rem; color: #cbb8a6; text-decoration: none; font-size: .86rem; }
.tb-sublink:hover { color: #fff; }
.tb-sublink.active { color: var(--tb-secondary); font-weight: 600; }
.tb-sidebar-foot { font-size: .7rem; color: #8c7a6b; padding: .8rem 1rem; border-top: 1px solid rgba(255,255,255,.06); }
.tb-main { flex: 1; margin-left: var(--tb-sidebar-w); min-width: 0; display: flex; flex-direction: column; }
.tb-topbar { background: #fff; border-bottom: 1px solid #eee2d6; padding: .5rem 1rem; display: flex; align-items: center; gap: .5rem; position: sticky; top: 0; z-index: 1030; }
.tb-suc { max-width: 220px; }
.tb-content { padding: 1.25rem; flex: 1; }
.tb-avatar { width: 34px; height: 34px; border-radius: 50%; background: var(--tb-primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; }
@media (max-width: 991.98px) {
  .tb-sidebar { transform: translateX(-100%); }
  .tb-sidebar.show { transform: none; box-shadow: 0 0 30px rgba(0,0,0,.4); }
  .tb-main { margin-left: 0; }
  .tb-content { padding: .75rem; }
}
.btn-tb { background: var(--tb-primary); color: #fff; border-color: var(--tb-primary); }
.btn-tb:hover, .btn-tb:focus { background: var(--tb-primary); filter: brightness(.9); color: #fff; }
.btn-outline-tb { color: var(--tb-primary); border-color: var(--tb-primary); }
.btn-outline-tb:hover { background: var(--tb-primary); color: #fff; }
.text-tb { color: var(--tb-primary) !important; }
.bg-tb { background: var(--tb-primary) !important; color: #fff; }
.card { border: 1px solid #efe4d8; border-radius: .75rem; box-shadow: 0 1px 2px rgba(80,50,20,.04); }
.card-header { background: #fff; border-bottom: 1px solid #f1e8de; font-weight: 600; }
.page-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.page-head h1 { font-size: 1.35rem; margin: 0; font-weight: 700; color: #3c2a1e; }
.page-head h1 i { color: var(--tb-primary); }
.table { --bs-table-bg: transparent; }
.table thead th { font-size: .78rem; text-transform: uppercase; letter-spacing: .02em; color: #7b6a5c; background: #fbf7f2; white-space: nowrap; }
.table td { vertical-align: middle; }
.kpi { border-radius: .8rem; padding: 1rem; background: #fff; border: 1px solid #efe4d8; height: 100%; }
.kpi .kpi-label { font-size: .78rem; color: #8a7767; text-transform: uppercase; }
.kpi .kpi-value { font-size: 1.5rem; font-weight: 700; color: #3c2a1e; }
.kpi .kpi-icon { font-size: 1.6rem; color: var(--tb-primary); opacity: .85; }
.filters { background: #fff; border: 1px solid #efe4d8; border-radius: .75rem; padding: .75rem; margin-bottom: 1rem; }
.form-label { font-weight: 500; font-size: .85rem; margin-bottom: .2rem; }
.required::after { content: " *"; color: #dc3545; }
.img-thumb { width: 44px; height: 44px; object-fit: cover; border-radius: 8px; background: #f3ece4; }
.perm-group { border: 1px solid #efe4d8; border-radius: .6rem; padding: .75rem; margin-bottom: .75rem; background: #fff; }
.perm-group h6 { font-weight: 700; color: var(--tb-primary); }

/* POS */
.pos-wrap { display: grid; grid-template-columns: 1fr 400px; gap: 1rem; height: calc(100vh - 110px); }
.pos-products { display: flex; flex-direction: column; min-height: 0; }
.pos-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: .6rem; overflow-y: auto; padding: .25rem; }
.pos-item { background: #fff; border: 1px solid #eadfd3; border-radius: .7rem; cursor: pointer; overflow: hidden; text-align: center; transition: transform .08s, box-shadow .08s; user-select: none; }
.pos-item:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,.08); }
.pos-item img, .pos-item .ph { width: 100%; height: 80px; object-fit: cover; background: #f5ede4; display: flex; align-items: center; justify-content: center; font-size: 2rem; color: #c9a88a; }
.pos-item .nm { font-size: .8rem; font-weight: 600; padding: .3rem .35rem 0; line-height: 1.15; height: 2.3em; overflow: hidden; }
.pos-item .pr { color: var(--tb-primary); font-weight: 700; font-size: .9rem; padding-bottom: .3rem; }
.pos-item .st { font-size: .7rem; color: #8a7767; }
.pos-item.agotado { opacity: .55; }
.pos-cats { display: flex; gap: .35rem; overflow-x: auto; padding-bottom: .4rem; }
.pos-cats .btn { white-space: nowrap; }
.pos-cart { background: #fff; border: 1px solid #eadfd3; border-radius: .8rem; display: flex; flex-direction: column; min-height: 0; }
.pos-lines { flex: 1; overflow-y: auto; }
.pos-line { display: flex; align-items: center; gap: .4rem; padding: .45rem .6rem; border-bottom: 1px dashed #eee2d6; }
.pos-line .nm { flex: 1; font-size: .85rem; line-height: 1.1; }
.pos-line input { width: 64px; }
.pos-total { font-size: 1.8rem; font-weight: 800; color: var(--tb-primary); }
@media (max-width: 991.98px) { .pos-wrap { grid-template-columns: 1fr; height: auto; } .pos-grid { max-height: 50vh; } }

/* Calendario */
.cal { width: 100%; table-layout: fixed; }
.cal th { text-align: center; background: #fbf7f2; font-size: .8rem; padding: .4rem; }
.cal td { height: 110px; vertical-align: top; border: 1px solid #efe4d8; padding: .25rem; background: #fff; }
.cal td.otro { background: #faf7f3; color: #bbb; }
.cal td.hoy { background: #fff8ec; }
.cal .dnum { font-weight: 700; font-size: .85rem; }
.cal .ev { display: block; font-size: .72rem; padding: 1px 4px; border-radius: 4px; margin-top: 2px; text-decoration: none; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 767.98px) { .cal td { height: 70px; } .cal .ev { font-size: .6rem; } }

.timeline { list-style: none; padding-left: 0; }
.timeline li { position: relative; padding-left: 1.2rem; margin-bottom: .5rem; font-size: .85rem; }
.timeline li::before { content: ""; position: absolute; left: 0; top: .45rem; width: 8px; height: 8px; border-radius: 50%; background: var(--tb-primary); }

/* Login */
.tb-login { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #3b2416 0%, #8b4513 55%, #f4a261 100%); padding: 1rem; }
.tb-login .card { width: 100%; max-width: 410px; border: 0; border-radius: 1rem; box-shadow: 0 15px 50px rgba(0,0,0,.3); }
.tb-login .logo { width: 84px; height: 84px; object-fit: contain; }

@media print {
  .tb-sidebar, .tb-topbar, .no-print, .filters { display: none !important; }
  .tb-main { margin-left: 0 !important; }
  .tb-content { padding: 0 !important; }
  .card { border: 0; box-shadow: none; }
  body.tb-app { background: #fff; }
}

/* Select con búsqueda */
.ts-wrap { position: relative; }
.ts-dd { display: none; position: absolute; left: 0; right: 0; top: 100%; z-index: 1060; background: #fff; border: 1px solid #dcccbc; border-radius: .4rem; max-height: 260px; overflow-y: auto; box-shadow: 0 8px 24px rgba(0,0,0,.12); min-width: 220px; }
.ts-opt { padding: .35rem .6rem; cursor: pointer; font-size: .88rem; }
.ts-opt:hover, .ts-opt.act { background: #f6ede3; }
.ts-opt.sel { font-weight: 600; color: var(--tb-primary); }
.btn-tb:disabled, .btn-tb.disabled { background: var(--tb-primary); border-color: var(--tb-primary); color: #fff; opacity: .55; }
.btn-outline-tb:disabled { color: var(--tb-primary); border-color: var(--tb-primary); }
.pos-item .nm { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
