/* ФермерМаркет Касса — фирменный стиль: белый фон + тёплый оранжевый (согласован в макетах) */
:root{
  color-scheme:light;
  --page:#f1ede6; --surface:#ffffff; --card:#ffffff;
  --ink:#1f1d1a; --ink2:#5a554d; --muted:#8f887c;
  --grid:#ece7de; --baseline:#d8d1c5; --ring:rgba(31,25,15,.12);
  --or:#d97757; --or-deep:#c15f3c; --or-text:#a84e2e; --or-bg:#faf1ec;
  --good:#0ca30c; --good-text:#006300; --warn:#fab219; --crit:#d03b3b;
  --chip:#f6f1e9; --blue-bg:#e8f0fb; --blue-text:#1c5cab;
}
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent}
html{font-size:16px}
body{margin:0; background:var(--page); color:var(--ink);
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif; font-size:15px; line-height:1.45}
a{color:var(--or-text)}
.wrap{max-width:520px; margin:0 auto; min-height:100dvh; background:var(--surface);
  display:flex; flex-direction:column; box-shadow:0 0 30px rgba(0,0,0,.06)}
@media(min-width:900px){.wrap{max-width:700px}}
main{flex:1; padding:12px 12px calc(84px + env(safe-area-inset-bottom))}
@media(min-width:900px){main{padding-bottom:24px}}

/* верхняя панель */
.appbar{display:flex; align-items:center; justify-content:space-between;
  padding:12px 14px 8px; gap:8px}
.logo{font-weight:700; font-size:16px; color:var(--ink); text-decoration:none; white-space:nowrap;
  display:flex; align-items:center; gap:9px}
.logo b{color:var(--or-deep)}
.logo-img{height:30px; width:auto; display:block}
.logo-sub{font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--or-text); border:1.5px solid #ecd7ca; background:var(--or-bg);
  border-radius:8px; padding:3px 8px}
@media(min-width:900px){.logo-img{height:34px}}
.login-logo{width:220px; max-width:72%; margin:0 auto; display:block}
.userchip{display:flex; align-items:center; gap:7px; background:var(--chip);
  border-radius:20px; padding:4px 10px 4px 4px; font-size:12px; color:var(--ink2);
  text-decoration:none}
.ava{width:24px; height:24px; border-radius:50%; background:var(--or-deep); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700}

/* нижняя навигация (мобильная) */
.bottomnav{position:fixed; bottom:0; left:50%; transform:translateX(-50%);
  width:100%; max-width:520px; display:flex; border-top:1px solid var(--grid);
  background:var(--card); z-index:30; padding-bottom:env(safe-area-inset-bottom)}
@media(min-width:900px){.bottomnav{display:none}}
.bn{flex:1; text-align:center; padding:8px 0 10px; font-size:10.5px; color:var(--muted);
  text-decoration:none}
.bn .ic{font-size:19px; display:block; margin-bottom:1px}
.bn.active{color:var(--or-text); font-weight:700}

/* карточки и заголовки */
.card{background:var(--card); border:1px solid var(--ring); border-radius:16px;
  padding:14px; margin-bottom:10px}
.sect{font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--or-text); margin:0 0 10px}
.hint{font-size:12px; color:var(--muted)}
.num{font-variant-numeric:tabular-nums; font-weight:600}
.hero-label{font-size:13px; color:var(--ink2)}
.hero{font-size:40px; font-weight:650; letter-spacing:-.5px; margin:2px 0 6px; color:var(--or-deep)}
h1.page{font-size:20px; margin:6px 2px 12px}

/* строки-списки */
.row{display:flex; justify-content:space-between; align-items:center; gap:8px;
  padding:10px 2px; border-top:1px solid var(--grid); text-decoration:none; color:inherit}
.row:first-child{border-top:0}
.row .l{min-width:0}
.row .d1{font-size:14px; display:flex; align-items:center; gap:6px; flex-wrap:wrap}
.row .d2{font-size:11.5px; color:var(--muted); margin-top:1px}
.row .amt{font-variant-numeric:tabular-nums; font-weight:650; font-size:14.5px; white-space:nowrap}
.row .amt .sub{display:block; font-size:11px; color:var(--crit); text-align:right; font-weight:600}
.frow{display:flex; justify-content:space-between; align-items:baseline; padding:7px 0;
  border-bottom:1px solid var(--grid); font-size:14px}
.frow:last-child{border-bottom:0}
.frow .lbl{color:var(--ink2)}
.frow.total{border-top:2px solid var(--baseline); border-bottom:0; padding-top:9px}
.frow.total .lbl{color:var(--ink); font-weight:650}

/* чипы статусов */
.chip{display:inline-flex; align-items:center; gap:4px; font-size:10.5px; padding:2px 8px;
  border-radius:8px; background:var(--chip); color:var(--ink2); font-weight:600; white-space:nowrap}
.chip.good{background:#e5f4e5; color:var(--good-text)}
.chip.warn{background:#fdf2d7; color:#7a5c00}
.chip.crit{background:#fbe7e7; color:var(--crit)}
.chip.blue{background:var(--blue-bg); color:var(--blue-text)}
.chip.orange{background:var(--or-bg); color:var(--or-text)}

/* формы */
form.stack{display:flex; flex-direction:column; gap:12px}
label.f{display:block}
label.f .t{font-size:12.5px; color:var(--ink2); margin-bottom:4px; display:block; font-weight:600}
input[type=text],input[type=password],input[type=number],input[type=date],
input[type=month],select,textarea{
  width:100%; border:1.5px solid var(--baseline); border-radius:12px; padding:11px 12px;
  font-size:16px; font-family:inherit; background:var(--card); color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:none; border-color:var(--or)}
textarea{min-height:70px; resize:vertical}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:7px; width:100%;
  border:0; border-radius:13px; padding:13px 16px; font-size:15.5px; font-weight:650;
  background:var(--or-deep); color:#fff; cursor:pointer; text-decoration:none}
.btn.secondary{background:var(--or-bg); color:var(--or-text); border:1.5px solid #ecd7ca}
.btn.ghost{background:none; color:var(--or-text); border:1.5px solid var(--baseline)}
.btn.danger{background:var(--crit)}
.btn.small{width:auto; padding:8px 13px; font-size:13px; border-radius:10px}
.btnrow{display:flex; gap:8px}
.btnrow .btn{flex:1}
.seg{display:flex; gap:8px; flex-wrap:wrap}
.seg label{flex:1; min-width:110px}
.seg input{position:absolute; opacity:0}
.seg .segbtn{display:block; text-align:center; border:1.5px solid var(--baseline);
  border-radius:12px; padding:10px 8px; font-size:13.5px; color:var(--ink2); cursor:pointer}
.seg input:checked + .segbtn{border-color:var(--or-deep); background:var(--or-bg);
  color:var(--or-text); font-weight:650}

/* сообщения */
.flash{border-radius:12px; padding:11px 13px; font-size:13.5px; margin-bottom:10px; font-weight:600}
.flash.ok{background:#e5f4e5; color:var(--good-text)}
.flash.err{background:#fbe7e7; color:var(--crit)}

/* фото */
.photo-thumb{display:block; max-width:180px; border-radius:10px; border:1px solid var(--ring)}
.photo-full{max-width:100%; border-radius:12px}

/* таблицы */
.twrap{overflow-x:auto}
table.t{border-collapse:collapse; width:100%; font-size:13px}
.t th{font-size:11px; color:var(--ink2); text-align:left; padding:7px 6px;
  border-bottom:2px solid var(--baseline); white-space:nowrap}
.t td{padding:7px 6px; border-bottom:1px solid var(--grid); vertical-align:top}
.t td.n{text-align:right; font-variant-numeric:tabular-nums; font-weight:600; white-space:nowrap}

/* панель входа */
.login-wrap{min-height:100dvh; display:flex; align-items:center; justify-content:center;
  background:var(--page); padding:20px}
.login-card{width:100%; max-width:380px; background:var(--card); border:1px solid var(--ring);
  border-radius:20px; padding:26px 22px}

/* категории-полоски */
.catbar{height:8px; border-radius:0 4px 4px 0; background:var(--or)}
.tiles{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:10px}

.tile{background:var(--card); border:1px solid var(--ring); border-radius:14px; padding:10px;
  text-decoration:none; color:inherit; display:block}
.tile .tl{display:block; font-size:11px; color:var(--muted); line-height:1.3}
.tile .tv{display:block; font-size:16px; font-weight:650; color:var(--or-text); margin-top:3px;
  font-variant-numeric:tabular-nums}
.tile .ts{display:block; font-size:10.5px; color:var(--muted); margin-top:1px}

/* быстрые действия на дашборде */
.quick{display:grid; grid-template-columns:1fr 1fr; gap:8px}
.quick .btn{font-size:14px; padding:12px 10px}

/* шаги статусов в карточке */
.steps{margin:6px 0}
.step{display:flex; gap:11px; position:relative; padding-bottom:14px}
.step:last-child{padding-bottom:2px}
.step::before{content:""; position:absolute; left:7px; top:18px; bottom:0; width:2px; background:var(--grid)}
.step:last-child::before{display:none}
.dot{width:16px; height:16px; border-radius:50%; background:var(--chip);
  border:2px solid var(--baseline); flex:none; margin-top:2px}
.step.done .dot{background:var(--good); border-color:var(--good)}
.step.wait .dot{background:var(--card); border-color:var(--warn)}
.step .st{font-size:14px; font-weight:600}
.step .sd{font-size:12.5px; color:var(--ink2)}

/* меню «Ещё» */
.menu a{display:flex; justify-content:space-between; align-items:center; padding:13px 4px;
  border-top:1px solid var(--grid); text-decoration:none; color:var(--ink); font-size:15px}
.menu a:first-child{border-top:0}
.menu a span.arr{color:var(--muted)}

/* верхняя навигация (десктоп) — кнопки-таблетки с иконками */
.topnav{display:none; gap:8px; padding:2px 12px 12px; flex-wrap:wrap}
.topnav a{display:inline-flex; align-items:center; gap:7px; padding:9px 16px;
  border-radius:12px; font-size:13.5px; font-weight:650; color:var(--ink2);
  text-decoration:none; border:1.5px solid var(--ring); background:var(--card);
  box-shadow:0 1px 2px rgba(31,25,15,.04);
  transition:background .15s, border-color .15s, color .15s, box-shadow .15s}
.topnav a .ic{font-size:15px; line-height:1}
.topnav a:hover{border-color:var(--or); color:var(--or-text); background:var(--or-bg);
  box-shadow:0 2px 6px rgba(193,95,60,.15)}
.topnav a.active{background:var(--or-deep); border-color:var(--or-deep); color:#fff;
  box-shadow:0 2px 8px rgba(193,95,60,.3)}
@media(min-width:900px){
  .topnav{display:flex}
  .quick{display:flex; flex-wrap:wrap}
  .quick .btn{flex:0 1 auto; width:auto; min-width:200px}
}