:root {
  --bg: #f3f5f1;
  --panel: #ffffff;
  --text: #1d2820;
  --muted: #69756d;
  --primary: #246b45;
  --primary-dark: #174b31;
  --line: #d9e1da;
  --danger: #a33434;
  --warning: #946200;
}

* { box-sizing: border-box; }
body { margin: 0; font-family: Arial, Helvetica, sans-serif; background: var(--bg); color: var(--text); }
a { color: var(--primary); text-decoration: none; }
.topbar { background: #102419; color: #fff; padding: 12px 18px; display: flex; justify-content: space-between; gap: 18px; align-items: center; position: sticky; top: 0; z-index: 30; }
.brand-block { display: flex; align-items: center; gap: 12px; }
.brand-block strong { display: block; font-size: 18px; }
.sidebar-toggle { background: rgba(255,255,255,.12); color: #fff; border: 1px solid rgba(255,255,255,.18); padding: 8px 10px; }
.sidebar-toggle:hover { background: #fff; color: var(--primary-dark); }
.app-shell { display: grid; grid-template-columns: 260px minmax(0, 1fr); min-height: calc(100vh - 65px); transition: grid-template-columns .2s ease; }
.sidebar { background: #ffffff; border-right: 1px solid var(--line); padding: 18px 14px; position: sticky; top: 65px; align-self: start; height: calc(100vh - 65px); overflow-y: auto; transition: transform .2s ease, opacity .2s ease; }
.sidebar-backdrop { display: none; }
.sidebar-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-weight: 800; color: var(--primary-dark); margin: 0 0 12px; padding: 0 8px; }
.sidebar-close { display: none; padding: 8px 10px; font-size: 13px; }
.sidebar-nav { display: grid; gap: 6px; }
.sidebar-nav a, .sidebar-group summary { color: var(--text); padding: 11px 12px; border-radius: 11px; font-size: 15px; font-weight: 700; }
.sidebar-nav a:hover, .sidebar-nav a.active, .sidebar-group summary:hover, .sidebar-group summary.active { background: #edf3ee; color: var(--primary-dark); }
.sidebar-nav a.active, .sidebar-group summary.active { box-shadow: inset 4px 0 0 var(--primary); }
.sidebar-group summary { cursor: pointer; list-style: none; }
.sidebar-group summary::-webkit-details-marker { display: none; }
.sidebar-group a { display: block; margin-left: 12px; padding: 9px 12px; font-size: 14px; font-weight: 600; }
.sidebar-section { border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; font-weight: 800; letter-spacing: .04em; margin: 8px 0 2px; padding: 14px 8px 4px; text-transform: uppercase; }
.sidebar-collapsed .app-shell { grid-template-columns: 0 minmax(0, 1fr); }
.sidebar-collapsed .sidebar { transform: translateX(-100%); opacity: 0; pointer-events: none; padding-left: 0; padding-right: 0; border-right: 0; }
.app-content { min-width: 0; }
.account-box { display: flex; align-items: center; gap: 12px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); border-radius: 16px; padding: 8px 10px; }
.account-user strong { display: block; font-size: 14px; color: #fff; }
.account-user span { display: block; color: #cfe0d3; font-size: 12px; }
.settings-menu { position: relative; }
.settings-menu summary { list-style: none; cursor: pointer; border-radius: 10px; padding: 9px 12px; background: rgba(255,255,255,.12); color: #fff; font-weight: 700; font-size: 13px; }
.settings-menu summary::-webkit-details-marker { display: none; }
.settings-menu[open] summary { background: #fff; color: var(--primary-dark); }
.settings-menu div { position: absolute; right: 0; top: calc(100% + 8px); min-width: 170px; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 8px; box-shadow: 0 14px 30px rgba(16, 36, 25, .18); z-index: 20; }
.settings-menu a { display: block; color: var(--text); padding: 9px 10px; border-radius: 8px; font-size: 14px; }
.settings-menu a:hover { background: #edf3ee; color: var(--primary-dark); }
.logout-button { display: inline-block; background: #fff; color: var(--primary-dark); border-radius: 10px; padding: 9px 12px; font-weight: 700; }
.logout-button:hover { color: var(--primary-dark); }
.container { max-width: 1180px; margin: 0 auto; padding: 22px; }
.app-footer { color: var(--muted); font-size: 13px; margin-top: 28px; padding: 18px 0 4px; text-align: center; }
.login-wrap { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.card { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 18px; box-shadow: 0 12px 30px rgba(16, 36, 25, .06); margin-bottom: 18px; }
.login-card { width: 100%; max-width: 420px; }
.login-logo { display: block; width: 74px; height: 74px; object-fit: contain; margin: 0 0 12px; }
.login-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.login-actions a { font-weight: 700; }
.permissions-box { grid-column: 1 / -1; border: 1px solid var(--line); border-radius: 12px; padding: 14px; background: #fbfcfb; }
.permissions-box h3 { margin: 0 0 8px; }
.checkbox-label { color: var(--text); font-size: 14px; margin: 0; }
.chart-card { min-width: 0; }
.bar-chart { display: grid; gap: 10px; }
.bar-row { display: grid; grid-template-columns: minmax(110px, 1.1fr) minmax(140px, 2fr) minmax(90px, auto); gap: 10px; align-items: center; }
.bar-row span { color: var(--text); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bar-row div { height: 12px; background: #e8eee9; border-radius: 999px; overflow: hidden; }
.bar-row i { display: block; height: 100%; background: linear-gradient(90deg, var(--primary), #80b18d); border-radius: inherit; }
.bar-row strong { font-size: 13px; text-align: right; }
h1 { margin: 8px 0 18px; }
h2 { margin: 0 0 14px; font-size: 20px; }
.grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.stat { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 18px; }
.stat strong { display: block; font-size: 30px; color: var(--primary); }
.stat span { color: var(--muted); font-size: 14px; }
form label { display: block; color: var(--muted); font-size: 13px; margin-bottom: 10px; }
input, select, textarea { width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; font: inherit; background: #fff; color: var(--text); margin-top: 5px; }
input, select, textarea, button { font-size: 16px; }
input[type="checkbox"] { width: auto; margin-right: 8px; min-height: 0; }
textarea { min-height: 88px; resize: vertical; }
.pix-qrcode { max-width: 220px; width: 100%; border: 1px solid var(--line); border-radius: 12px; padding: 10px; background: #fff; }
button, .button { display: inline-block; border: 0; border-radius: 10px; padding: 10px 14px; background: var(--primary); color: #fff; font-weight: 700; cursor: pointer; }
button:hover, .button:hover { background: var(--primary-dark); color: #fff; }
.button.secondary { background: #e5ebe6; color: var(--text); }
.actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.section-title { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin-bottom: 14px; }
.section-title h2 { margin: 0; }
.filter-inline { min-width: 320px; }
.filter-inline label { margin: 0; }

.quick-tools { display: grid; gap: 14px; margin: 16px 0; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-muted); }
.quick-add-form { display: grid; grid-template-columns: auto minmax(160px, 1.5fr) minmax(70px, .5fr) minmax(90px, .7fr) minmax(110px, .8fr) minmax(140px, 1fr) auto; align-items: end; gap: 8px; }
.quick-add-form strong { align-self: center; }
.quick-import-form { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 10px; }
.quick-import-form textarea { min-height: 72px; }
#itens-cadastrados table input, #itens-cadastrados table select { min-width: 70px; width: 100%; }
.bulk-check-label, .purchased-toggle { display: inline-flex; align-items: center; gap: 6px; margin: 0; white-space: nowrap; }
.purchased-toggle input { width: auto !important; min-width: 0 !important; }
#itens-cadastrados { scroll-margin-top: 18px; }
.theme-preview { display: grid; gap: 8px; padding: 14px; border-radius: 14px; background: var(--preview-bg); border: 1px solid var(--line); }
.theme-preview strong { color: var(--preview-primary); }
.theme-preview span { display: inline-block; width: fit-content; padding: 7px 10px; border-radius: 10px; background: var(--preview-top); color: #fff; }
.theme-preview div { padding: 12px; border-radius: 12px; background: var(--preview-panel); border: 1px solid var(--line); }
.color-dot { display: inline-block; width: 18px; height: 18px; border-radius: 999px; border: 1px solid var(--line); vertical-align: middle; }
.muted-text { color: var(--muted); }
.theme-template-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
.theme-template { background: #fff; color: var(--text); border: 1px solid var(--line); text-align: left; padding: 14px; }
.theme-template:hover { background: #f8fbf8; color: var(--text); border-color: var(--primary); }
.theme-template strong { display: block; margin-bottom: 10px; }
.theme-template span { display: flex; gap: 6px; }
.theme-template i { display: block; width: 28px; height: 28px; border-radius: 999px; border: 1px solid var(--line); }
.theme-form input[type="color"] { height: 44px; padding: 5px; }
.inline-form { display: inline; }
.inline-form button { padding: 7px 10px; font-size: 13px; }
.status-form select { min-width: 132px; margin: 0; padding: 7px 10px; }
.shopping-lists-table { table-layout: fixed; }
.shopping-lists-table th:nth-child(1) { width: 15%; }
.shopping-lists-table th:nth-child(2) { width: 10%; }
.shopping-lists-table th:nth-child(3) { width: 11%; }
.shopping-lists-table th:nth-child(4) { width: 13%; }
.shopping-lists-table th:nth-child(5) { width: 13%; }
.shopping-lists-table th:nth-child(6) { width: 12%; }
.shopping-lists-table th:nth-child(7) { width: 26%; }
.shopping-lists-table th, .shopping-lists-table td { padding: 10px 9px; font-size: 14px; vertical-align: middle; }
.shopping-lists-table td { overflow-wrap: normal; }
.shopping-lists-table td:first-child { font-weight: 600; }
.shopping-lists-table td:nth-child(1), .shopping-lists-table td:nth-child(6) { overflow-wrap: anywhere; }
.shopping-lists-table th:nth-child(3), .shopping-lists-table td:nth-child(3) { min-width: 96px; white-space: nowrap; }
.shopping-lists-table th:nth-child(5), .shopping-lists-table td:nth-child(5) { min-width: 132px; white-space: nowrap; }
.list-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; align-items: stretch; }
.shopping-lists-table td:last-child { min-width: 290px; overflow: visible; }
.list-actions .button, .list-action-form, .list-action-form button { width: 100%; }
.list-actions .button, .list-action-form button { padding: 7px 8px; font-size: 13px; line-height: 1.2; text-align: center; white-space: nowrap; }
.list-action-form { display: block; }
.execution-actions { min-width: 112px; }
.execution-actions .button, .execution-actions button { padding: 6px 9px; font-size: 12px; line-height: 1.15; border-radius: 8px; white-space: nowrap; }
.execution-actions .button + .button { margin-left: 4px; }
table { width: 100%; border-collapse: collapse; background: #fff; border-radius: 14px; overflow: hidden; border: 1px solid var(--line); }
th, td { padding: 11px 12px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: top; }
th { background: #edf3ee; font-size: 13px; color: #415144; }
tr:last-child td { border-bottom: 0; }
.alert { padding: 12px 14px; border-radius: 12px; margin-bottom: 14px; background: #e7f4eb; color: #174b31; }
.alert.error { background: #f7e7e7; color: var(--danger); }
.badge { display: inline-block; padding: 4px 8px; border-radius: 999px; background: #e9efe9; font-size: 12px; color: #314036; }
.badge.entrada { background: #dff2e4; color: #17623b; }
.badge.saida, .badge.perda { background: #f7e2e2; color: #9d1f1f; }
.badge.ajuste { background: #fff0cc; color: #946200; }
.badge.vencida, .badge.vencido { background: #f7e2e2; color: var(--danger); }
.badge.pendente, .badge.suspenso, .badge.suspensa, .badge.trial { background: #fff0cc; color: var(--warning); }
.badge.executada, .badge.ativa, .badge.finalizada, .badge.pago, .badge.ativo { background: #dff2e4; color: var(--primary-dark); }
.badge.cancelado, .badge.cancelada, .badge.encerrado { background: #eeeeee; color: #555; }
.empresa-switch { display: flex; gap: 8px; align-items: end; max-width: 360px; margin: 0 0 12px auto; }
.empty { color: var(--muted); padding: 16px; background: #fff; border-radius: 12px; border: 1px dashed var(--line); }
.document { max-width: 980px; margin-left: auto; margin-right: auto; }
.document-header { display: flex; justify-content: space-between; gap: 18px; border-bottom: 2px solid var(--line); padding-bottom: 14px; margin-bottom: 16px; }
.document-header p, .document p { margin: 6px 0; }
.document h3 { margin: 0 0 10px; color: var(--primary-dark); }
.document-grid { grid-template-columns: 1fr 1fr; align-items: start; }
.document-block { margin-top: 18px; }
.signature-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-top: 54px; }
.signature-grid div { border-top: 1px solid var(--text); text-align: center; padding-top: 8px; color: var(--muted); }
.shopping-table .check-col { width: 52px; text-align: center; }
.print-check { display: inline-grid; place-items: center; width: 18px; height: 18px; border: 1px solid var(--text); border-radius: 3px; font-weight: 700; font-size: 12px; }
.calendar-filter .grid { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 2fr auto; align-items: end; }
.calendar-toolbar { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin-bottom: 8px; }
.calendar-toolbar h2 { margin: 0; }
.calendar-toolbar strong { min-width: 130px; text-align: center; }
.calendar-help { color: var(--muted); margin: 0 0 14px; }
.calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(145px, 1fr)); }
.calendar-weekdays { border: 1px solid var(--line); border-bottom: 0; border-radius: 14px 14px 0 0; overflow: hidden; background: #edf3ee; }
.calendar-weekdays div { padding: 10px; text-align: center; font-weight: 700; color: #415144; font-size: 13px; }
.calendar-month { border-left: 1px solid var(--line); border-top: 1px solid var(--line); }
.calendar-day { min-height: 142px; background: #fff; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 8px; transition: background .15s, box-shadow .15s; }
.calendar-day.outside-month { background: #f8faf8; color: #9aa49d; }
.calendar-day.today { background: #fff7df; box-shadow: inset 0 0 0 2px #e2a829; }
.calendar-day.today .calendar-day-number::after { content: ' Hoje'; color: #946200; font-size: 11px; }
.calendar-day.today-pulse { animation: todayPulse 1.2s ease-in-out 2; }
.calendar-day.drop-target { background: #e5f3ff; box-shadow: inset 0 0 0 2px #76a9d8; }
.calendar-day-number { font-weight: 700; font-size: 13px; margin-bottom: 7px; }
.calendar-events { display: grid; gap: 6px; }
.calendar-event { border: 1px solid #c9dbea; background: #e9f4ff; border-radius: 10px; padding: 8px; cursor: pointer; box-shadow: 0 4px 12px rgba(20, 40, 60, .08); }
.calendar-event[draggable="true"] { cursor: grab; }
.calendar-event:hover { border-color: #76a9d8; box-shadow: 0 6px 18px rgba(20, 40, 60, .14); }
.calendar-event.dragging { opacity: .45; }
.calendar-event strong { display: block; font-size: 13px; color: #17334f; margin-bottom: 3px; }
.calendar-event span { display: block; font-size: 11px; color: #4d6377; line-height: 1.35; }
.calendar-event em { display: inline-block; margin-top: 5px; font-size: 10px; font-style: normal; padding: 3px 6px; border-radius: 999px; background: rgba(255,255,255,.8); color: #17334f; }
.calendar-event.vencida { border-color: #e7b5b5; background: #fdeaea; }
.calendar-event.vencida strong { color: var(--danger); }
.calendar-event.executada { border-color: #b7dec2; background: #e5f7ea; }
.calendar-event.cancelada { border-color: #d4d4d4; background: #efefef; }
.weekly-kanban { display: grid; grid-template-columns: repeat(7, minmax(180px, 1fr)); gap: 12px; align-items: stretch; overflow-x: auto; padding-bottom: 4px; }
.kanban-column { min-height: 520px; border: 1px solid var(--line); border-radius: 16px; background: #fbfcfb; padding: 10px; }
.kanban-column.today { background: #fff8ea; border-color: #ead6a8; }
.kanban-header { border-bottom: 1px solid var(--line); padding-bottom: 10px; margin-bottom: 10px; }
.kanban-header strong { display: block; font-size: 17px; color: var(--primary-dark); }
.kanban-header span { display: block; color: var(--muted); font-size: 12px; margin-top: 3px; }
.kanban-header em { display: inline-block; font-style: normal; font-size: 11px; color: #415144; background: #edf3ee; border-radius: 999px; padding: 4px 8px; margin-top: 8px; }
.kanban-events { align-content: start; }
.kanban-event { padding: 10px; }
.kanban-event strong { font-size: 14px; }

@keyframes todayPulse {
  0%, 100% { box-shadow: inset 0 0 0 2px #e2a829; }
  50% { box-shadow: inset 0 0 0 4px #246b45, 0 0 0 6px rgba(36, 107, 69, .18); }
}

@media (max-width: 800px) {
  body { -webkit-tap-highlight-color: rgba(36, 107, 69, .16); }
  .grid, .grid-2 { grid-template-columns: 1fr; }
  .calendar-filter .grid { grid-template-columns: 1fr; }
  .calendar-card { overflow-x: auto; }
  .calendar-toolbar { align-items: flex-start; flex-direction: column; }
  .weekly-kanban { grid-template-columns: repeat(7, minmax(220px, 1fr)); }
  .section-title { align-items: flex-start; flex-direction: column; }
  .filter-inline { min-width: 100%; width: 100%; }
  .quick-add-form, .quick-import-form { grid-template-columns: 1fr; }
  .document-grid, .signature-grid { grid-template-columns: 1fr; }
  .topbar { align-items: stretch; flex-direction: column; gap: 10px; padding: 10px 12px; }
  .brand-block { justify-content: space-between; width: 100%; }
  .brand-block strong { font-size: 17px; }
  .sidebar-toggle { min-height: 44px; padding: 10px 14px; }
  .app-shell { display: block; }
  .sidebar { position: fixed; top: 0; left: 0; z-index: 40; width: min(78vw, 300px); height: 100dvh; transform: translateX(-100%); box-shadow: 16px 0 35px rgba(16, 36, 25, .18); }
  .sidebar-close { display: inline-flex; min-height: 38px; background: #e5ebe6; color: var(--text); }
  .sidebar-backdrop { display: block; position: fixed; inset: 0; z-index: 35; background: rgba(16, 36, 25, .42); opacity: 0; pointer-events: none; transition: opacity .2s ease; }
  .sidebar-collapsed .sidebar { transform: translateX(-100%); opacity: 0; }
  body:not(.sidebar-collapsed) .sidebar { transform: translateX(0); opacity: 1; pointer-events: auto; }
  body:not(.sidebar-collapsed) .sidebar-backdrop { opacity: 1; pointer-events: auto; }
  body:not(.sidebar-collapsed) { overflow: hidden; }
  .account-box { width: 100%; justify-content: space-between; border-radius: 12px; }
  .container { padding: 14px; }
  .app-footer { font-size: 12px; line-height: 1.45; padding-bottom: 10px; }
  .card { padding: 14px; border-radius: 12px; }
  h1 { font-size: 24px; margin-top: 4px; }
  h2 { font-size: 18px; }
  input, select, textarea { min-height: 44px; }
  button, .button, .logout-button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
  .actions { align-items: stretch; flex-direction: column; }
  .actions .button, .actions button { width: 100%; }
  .empresa-switch { display: block; max-width: none; margin: 0 0 14px; }
  .section-title { gap: 8px; }
  .calendar-grid { grid-template-columns: repeat(7, minmax(92px, 1fr)); }
  .calendar-day { min-height: 118px; padding: 6px; }
  .calendar-event { padding: 7px; }
  .calendar-event strong { font-size: 12px; }
  .calendar-event span { font-size: 10px; }
  .weekly-kanban { gap: 10px; }
  .kanban-column { min-height: 420px; }
  table { display: block; overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; }
  th, td { padding: 10px; }
}

@media (max-width: 520px) {
  .account-box { align-items: stretch; flex-direction: column; gap: 8px; }
  .logout-button { width: 100%; }
  .login-wrap { align-items: start; padding: 16px; }
  .login-card { margin-top: 18px; }
  .calendar-grid { grid-template-columns: repeat(7, minmax(78px, 1fr)); }
  .calendar-weekdays div { padding: 8px 4px; font-size: 11px; }
  .calendar-day { min-height: 106px; }
  .calendar-toolbar strong { min-width: 0; text-align: left; }
  .document-header { flex-direction: column; }
}

@media print {
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  @page { margin: 12mm; }
  body { background: var(--bg); }
  .topbar, .sidebar, .empresa-switch, .print-actions { display: none !important; }
  .app-shell { display: block; }
  .container { max-width: 1180px; padding: 22px; }
  .document {
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 18px;
    box-shadow: none;
  }
  .document-header { border-bottom: 2px solid var(--line); }
  .document-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
  .shopping-document .document-grid { grid-template-columns: 1fr 1fr; }
  table { border-radius: 14px; overflow: hidden; }
  th { background: #edf3ee !important; }
  a { color: inherit; }
}