/* ===== Base / Theme ===== */
:root{
  --bg:#f1f4f6; --surface:#ffffff; --muted:#6c757d; --text:#3a3f45;
  --primary:#3f6ad8; --success:#3ac47d; --danger:#d92550; --warning:#f7b924;
  --orange:#ff9f40;
  --border:#e1e5ea;
  --shadow:0 0.46875rem 2.1875rem rgba(90,97,105,.1),
           0 0.9375rem 1.40625rem rgba(90,97,105,.1),
           0 0.25rem 0.53125rem rgba(90,97,105,.12),
           0 0.125rem 0.1875rem rgba(90,97,105,.1);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol",sans-serif;}
img{max-width:100%;height:auto}
a{text-decoration:none;color:inherit}

/* ===== Header ===== */
.app-header{
  position:sticky;top:0;z-index:1000;height:64px;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 16px;background:var(--surface);border-bottom:1px solid var(--border);
  box-shadow:var(--shadow);
}
.header-left{display:flex;align-items:center;gap:10px}
.brand-link{display:inline-flex;align-items:center;height:48px}
.hamburger{
  display:inline-flex;align-items:center;justify-content:center;
  width:40px;height:40px;border:1px solid var(--border);background:#fff;
  border-radius:8px;font-size:18px;cursor:pointer;
}
.header-center{flex:1}
.header-right{min-width:140px;display:flex;justify-content:flex-end}
.user-chip{background:#eef3ff;border:1px solid #d8e1ff;color:#24408f;
  padding:6px 10px;border-radius:999px;font-size:.9rem;white-space:nowrap}
@media (min-width:992px){ .hamburger{display:none;} }

/* ===== Sidebar ===== */
.app-sidebar{
  position:fixed;left:0;top:64px;height:calc(100vh - 64px);width:280px;
  background:var(--surface);border-right:1px solid var(--border);
  box-shadow:var(--shadow);z-index:900;transform:translateX(-110%);
  transition:transform .25s ease;
}
.app-sidebar .sidebar-scroll{padding:12px 10px;display:flex;flex-direction:column;gap:6px;height:100%;overflow:auto}
.sidebar-heading{margin:12px 10px 6px;color:var(--muted);font-size:.8rem;text-transform:uppercase;letter-spacing:.06em}
.sidebar-item{
  display:flex;align-items:center;gap:10px;padding:10px 12px;
  border-radius:10px;border:1px solid transparent;color:var(--text);
}
.sidebar-item .ico{width:22px;text-align:center;opacity:.85}
.sidebar-item:hover{background:#f1f3f7}
.sidebar-item.active{background:#eef3ff;border-color:#d8e1ff;color:#24408f}
.sidebar-item.disabled{opacity:.55;pointer-events:none}
.sidebar-item.danger{color:#b02143}
.sidebar-flex{flex:1}
.app-sidebar.open{transform:translateX(0)}
.sidebar-backdrop{position:fixed;inset:64px 0 0 0;background:rgba(0,0,0,.2);display:none;z-index:800}
.sidebar-backdrop.show{display:block}
@media (min-width:992px){
  .app-sidebar{transform:translateX(0)}
  .sidebar-backdrop{display:none !important}
}

/* ===== Main layout ===== */
.app-main{padding:16px; margin-left:0;}
@media (min-width:992px){ body.has-sidebar .app-main{ margin-left:280px; } }
.content-wrap{max-width:1400px;margin:0 auto}
.page-titlebar{margin:6px 0 18px}
.page-title{margin:0 0 4px;font-size:1.6rem}
.page-subtitle{margin:0;color:var(--muted)}

/* ===== Grid ===== */
.row{display:grid;gap:16px}
.row-4{grid-template-columns:repeat(4,1fr)}
.row-3{grid-template-columns:repeat(3,1fr)}
.row-2{grid-template-columns:repeat(2,1fr)}
@media (max-width:1200px){ .row-4{grid-template-columns:repeat(2,1fr)} .row-3{grid-template-columns:repeat(2,1fr)} }
@media (max-width:768px){ .row-4,.row-3,.row-2{grid-template-columns:1fr} }

/* ===== Cards ===== */
.card{
  background:var(--surface);border:1px solid var(--border);border-radius:10px;
  box-shadow:var(--shadow);overflow:hidden;
}
.card-header{padding:12px 14px;border-bottom:1px solid var(--border);background:#fff}
.card-title{margin:0;font-size:1.05rem}
.card-body{padding:14px}

/* ===== Stat cards (цветна лента отгоре) ===== */
.card.stat{position:relative;padding:16px;display:flex;flex-direction:column;gap:6px}
.card.stat .stat-label{color:var(--muted);font-size:.95rem}
.card.stat .stat-value{font-size:1.9rem;font-weight:700}
.card.stat .stat-foot{color:var(--muted);font-size:.85rem}
.card.stat::before{
  content:'';position:absolute;top:0;left:0;height:6px;width:100%;background:var(--primary);
}
.card.stat.green::before{background:var(--success)}
.card.stat.red::before{background:var(--danger)}
.card.stat.blue::before{background:var(--primary)}
.card.stat.orange::before{background:var(--orange)}

/* ===== Tables ===== */
.table-wrap{width:100%;overflow:auto}
.table{width:100%;border-collapse:separate;border-spacing:0}
.table thead th{
  background:#f7f9fb;border-bottom:1px solid var(--border);color:#5b636a;
  font-weight:600;padding:10px 12px;text-align:left;white-space:nowrap;
}
.table tbody td{
  border-bottom:1px solid var(--border);padding:10px 12px;vertical-align:middle;
}
.table tbody tr:hover{background:#fafbfc}
.table .txt-right{text-align:right}
.muted{color:var(--muted);text-align:center}

/* ===== Buttons ===== */
.btn{display:inline-block;padding:10px 14px;border-radius:8px;border:1px solid var(--border);background:#f8f9fa}
.btn:hover{background:#f1f3f5}
.btn.primary{background:var(--primary);border-color:#355ec0;color:#fff}
.btn.success{background:var(--success);border-color:#2ca766;color:#fff}
.btn.light{background:#eef1f5;border-color:#e2e6ea;color:#2d3136}

/* ===== Login-only page ===== */
body.login-only{background:var(--bg);}
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.auth-card{width:100%;max-width:420px;text-align:center;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:28px;box-shadow:var(--shadow)}
.login-logo{width:150px;height:auto;display:block;margin:0 auto 8px;}
.title{margin:6px 0 14px;font-size:1.6rem}
.login-form label{display:block;margin-bottom:12px;text-align:left}
.login-form span{display:block;margin-bottom:6px;color:var(--muted);font-size:.95rem}
.login-form input{width:100%;padding:12px;border-radius:10px;border:1px solid var(--border);background:#fff;color:var(--text)}
.login-form input:focus{outline:none;border-color:#cbd3da;box-shadow:0 0 0 3px rgba(63,106,216,.15)}
.error{background:#ffe2e9;color:#7a142b;border:1px solid #ffc2d0;padding:10px;border-radius:10px;margin-bottom:12px}
.login-actions.centered{display:flex;justify-content:center;margin-top:10px}
.btn-primary{background:var(--primary);color:#fff;border:1px solid #355ec0;padding:12px 22px;border-radius:10px;cursor:pointer;font-weight:600}
.btn-primary:hover{filter:brightness(0.95)}

/* ===== Footer ===== */
.site-footer{margin-top:24px;padding:16px;text-align:center;color:var(--muted)}

/* spacing между прозорците */
.row.spaced { gap:24px; margin-bottom:24px; }
.card { margin-bottom:24px; }
/* Forms grid for income/expense pages */
.form-grid{
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.form-grid .wide{ grid-column: 1 / -1; }
@media (max-width: 900px){
  .form-grid{ grid-template-columns: 1fr; }
}

/* Accounts badges */
.badge{
  display:inline-block; padding:4px 8px; border-radius:999px;
  font-size:.82rem; line-height:1; border:1px solid var(--border);
}
.badge-success{ background:#e8f8f0; border-color:#c7ecd9; color:#206946; }
.badge-muted{ background:#f0f1f3; border-color:#e1e5ea; color:#6c757d; }

/* Forms grid (reuse) */
.form-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:12px; }
.form-grid .wide{ grid-column:1 / -1; }
@media (max-width: 900px){ .form-grid{ grid-template-columns: 1fr; } }

/* Категории – бейджове */
.badge{
  display:inline-block; padding:4px 8px; border-radius:999px;
  font-size:.82rem; line-height:1; border:1px solid var(--border);
}
.badge-income{ background:#e8f0ff; border-color:#cfdcff; color:#24408f; }
.badge-expense{ background:#ffe9e9; border-color:#ffd1d1; color:#8f2435; }

/* Формова решетка (повторно ползване) */
.form-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:12px; }
.form-grid .wide{ grid-column:1 / -1; }
@media (max-width: 900px){ .form-grid{ grid-template-columns: 1fr; } }


.badge{
  display:inline-block; padding:4px 8px; border-radius:999px;
  font-size:.82rem; line-height:1; border:1px solid var(--border);
}
.badge-success{ background:#e8f8f0; border-color:#c7ecd9; color:#206946; }
.badge-muted{ background:#f0f1f3; border-color:#e1e5ea; color:#6c757d; }

/* Формова решетка (повторно ползване) */
.form-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:12px; }
.form-grid .wide{ grid-column:1 / -1; }
@media (max-width: 900px){ .form-grid{ grid-template-columns: 1fr; } }



/* --- Спейсинг за секции --- */
.row.spaced { gap:24px; margin-bottom:24px; }
.card { margin-bottom:24px; }

/* --- 3 стат карти отгоре --- */
{grid-template-columns:repeat(3,1fr)}
@media (max-width:1200px){ .row-3{grid-template-columns:repeat(2,1fr)} }
@media (max-width:768px){ .row-3{grid-template-columns:1fr} }

/* --- Responsive таблици (мобилни) --- */
.table.rwd{ width:100%; border-collapse:separate; border-spacing:0 }
@media (max-width:768px){
  .table.rwd thead{ display:none; }
  .table.rwd tr{ display:block; border:1px solid var(--border); border-radius:10px; padding:8px; margin-bottom:10px; background:#fff; }
  .table.rwd td{
    display:flex; justify-content:space-between; gap:10px;
    border-bottom:1px dashed var(--border);
    padding:8px 6px;
  }
  .table.rwd td:last-child{ border-bottom:none; }
  .table.rwd td::before{
    content:attr(data-label);
    font-weight:600; color:#5b636a;
  }
  .txt-right{ text-align:right; }
}

/* --- Footer действия под таблица --- */
.table-actions{ display:flex; justify-content:center; margin-top:10px; }

/* ===== Pretty inline form for income ===== */
.form-inline{
  display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap;
}
.field{ position:relative; min-width:160px; }
.field.grow{ flex:1 1 260px; }
.field .hint{
  position:absolute; left:12px; top:-10px; background:#fff; padding:0 6px;
  font-size:.8rem; color:#6c757d; border-radius:6px; border:1px solid var(--border);
  transform:translateY(-50%); pointer-events:none;
}
.input.pretty{
  width:100%; padding:12px 12px; border-radius:10px; border:1px solid var(--border);
  background:#fff; color:var(--text);
}
.input.pretty::placeholder{ color:#9aa3ab; }
.input.pretty:focus{ outline:none; border-color:#cbd3da; box-shadow:0 0 0 3px rgba(63,106,216,.12); }

.actions-end{ display:flex; align-items:center; justify-content:center; }
.actions-end .btn{ padding:12px 18px; border-radius:10px; }

/* Desktop: всичко на един ред, Mobile: по едно под друго */
@media (min-width: 1100px){
  .form-inline{ flex-wrap:nowrap; }
  .field{ min-width:190px; }
}

/* Make selects look like inputs consistently */
.input.pretty::-ms-expand{ display:none; }
.input.pretty:-moz-focusring{ color:transparent; text-shadow:0 0 0 #000; }



/* Sidebar светъл стил */
.app-sidebar{
  width:220px;
  position:fixed;
  top:60px; /* отстъп, за да не закрива хедъра и логото */
  left:0; bottom:0;
  background:#ffffff; /* светло */
  border-right:1px solid #e1e5ea;
  overflow-y:auto;
  z-index:900;
  padding-top:10px;
}

.app-main{
  margin-left:220px;
  padding:20px;
}

/* Текст и линкове в менюто */
.app-sidebar .sidebar-item{
  display:flex; align-items:center; gap:8px;
  padding:10px 14px;
  color:#333;
  text-decoration:none;
  border-radius:6px;
  margin:2px 8px;
}
.app-sidebar .sidebar-item:hover{
  background:#f5f7fa;
}
.app-sidebar .sidebar-heading{
  font-size:.8rem; text-transform:uppercase;
  font-weight:600; color:#666;
  padding:10px 14px 4px;
}

/* Мобилна версия: sidebar скрит по подразбиране */
@media (max-width: 992px){
  .app-sidebar{
    left:-220px;
    transition:left .3s;
  }
  .app-sidebar.open{ left:0; }
  .app-main{ margin-left:0; }
}




/* ===== Visibility helpers ===== */
.desktop-only{ display:block; }
.mobile-only{ display:none; }
@media (max-width: 992px){
  .desktop-only{ display:none; }
  .mobile-only{ display:flex; }
}

/* ===== Mobile header (показва се само на мобилно) ===== */
.app-header{
  height:60px;
  align-items:center;
  justify-content:space-between;
  padding:0 10px;
  background:#ffffff;
  border-bottom:1px solid #e1e5ea;
}
.app-header .hamburger{
  background:#fff; border:1px solid #e1e5ea; border-radius:8px;
  width:40px; height:36px; font-size:20px; line-height:34px;
}
.app-header .brand{ display:flex; align-items:center; justify-content:center; flex:1; }
.header-logo{ height:30px; width:auto; display:block; margin:0 auto; }
.header-spacer{ width:40px; } /* балансира бутонa вляво */

/* ===== Sidebar (desktop: винаги видимо; mobile: off-canvas) ===== */
.app-sidebar{
  width:220px;
  position:fixed;
  top:0; left:0; bottom:0;
  background:#ffffff;
  border-right:1px solid #e1e5ea;
  overflow-y:auto;
  z-index:900;
  padding:10px 0;
}
.sidebar-scroll{ display:flex; flex-direction:column; height:100%; }
.sidebar-brand{ display:flex; align-items:center; justify-content:center; padding:8px 12px 14px; }
.sidebar-logo{ width:160px; height:auto; }

.sidebar-heading{
  font-size:.78rem; text-transform:uppercase; letter-spacing:.02em;
  font-weight:700; color:#7a8592; padding:10px 14px 6px;
}
.sidebar-item{
  display:flex; align-items:center; gap:8px;
  padding:10px 14px; color:#333; text-decoration:none;
  border-radius:8px; margin:2px 8px;
}
.sidebar-item:hover{ background:#f5f7fa; }
.sidebar-item.danger{ color:#b5072a; }
.sidebar-flex{ flex:1; }
.sidebar-backdrop{
  position:fixed; inset:0; background:rgba(0,0,0,.35); display:none; z-index:800;
}

@media (max-width: 992px){
  .app-sidebar{ left:-240px; top:60px; width:240px; transition:left .28s ease; }
  .app-sidebar.open{ left:0; }
  #sidebarBackdrop{ display:block; opacity:0; pointer-events:none; transition:opacity .28s; }
  .app-sidebar.open ~ #sidebarBackdrop{ opacity:1; pointer-events:auto; }
}

/* ===== Main area ===== */
.app-main{ margin-left:220px; padding:20px; }
@media (max-width: 992px){
  .app-main{ margin-left:0; padding:14px; }
}

/* (ако вече има подобни правила за .table.rwd, .card и т.н., остави ги) */

/* ===== Visibility helpers ===== */
.desktop-only{ display:block; }
.mobile-only{ display:none; }
@media (max-width: 992px){
  .desktop-only{ display:none; }
  .mobile-only{ display:flex; }
}

/* ===== Mobile header (само мобилно) ===== */
.app-header{
  height:60px;
  align-items:center;
  justify-content:space-between;
  padding:0 10px;
  background:#ffffff;
  border-bottom:1px solid #e1e5ea;
}
.app-header .hamburger{
  background:#fff; border:1px solid #e1e5ea; border-radius:8px;
  width:40px; height:36px; font-size:20px; line-height:34px;
}
.app-header .brand{ display:flex; align-items:center; justify-content:center; flex:1; }
.header-logo{ height:42px; width:auto; display:block; margin:0 auto; }
.header-spacer{ width:40px; }

/* ===== Sidebar (desktop: видимо; mobile: off-canvas) ===== */
.app-sidebar{
  width:260px;                       /* по-широко меню */
  position:fixed;
  top:0; left:0;
  height:100vh;                      /* 100% от височината на прозореца */
  background:#ffffff;
  border-right:1px solid #e1e5ea;
  overflow-y:auto;
  z-index:900;
  padding:10px 0 14px;
}
.sidebar-scroll{ display:flex; flex-direction:column; min-height:100%; }
.sidebar-brand{
  display:flex; align-items:center; justify-content:center;
  padding:10px 12px 16px;
}
.sidebar-logo{
  width:120px;                       /* по-малко лого */
  height:auto; display:block; margin:0 auto;
}

.sidebar-heading{
  font-size:.78rem; text-transform:uppercase; letter-spacing:.02em;
  font-weight:700; color:#7a8592; padding:10px 14px 6px;
}
.sidebar-item{
  display:flex; align-items:center; gap:8px;
  padding:10px 14px; color:#333; text-decoration:none;
  border-radius:8px; margin:2px 8px; font-size:15px;
}
.sidebar-item .txt{ white-space:nowrap; }  /* „Месечни разходи“ да не пренася */
.sidebar-item:hover{ background:#f5f7fa; }
.sidebar-item.danger{ color:#b5072a; }
.sidebar-flex{ flex:1; }
.sidebar-backdrop{
  position:fixed; inset:0; background:rgba(0,0,0,.35); display:none; z-index:800;
}

@media (max-width: 992px){
  .app-sidebar{ left:-260px; top:60px; width:260px; height:calc(100vh - 60px); transition:left .28s ease; }
  .app-sidebar.open{ left:0; }
  #sidebarBackdrop{ display:block; opacity:0; pointer-events:none; transition:opacity .28s; }
  .app-sidebar.open ~ #sidebarBackdrop{ opacity:1; pointer-events:auto; }
}

/* ===== Main area ===== */
.app-main{
  margin-left:260px;
  padding:20px;
  min-height:100vh;                  /* за да запълва екрана */
}
@media (max-width: 992px){
  .app-main{ margin-left:0; padding:14px; min-height:auto; }
}

/* ===== Карти, таблици ===== */
.row.spaced { gap:24px; margin-bottom:24px; }
.card { margin-bottom:24px; }

/* Responsive таблици */
.table.rwd{ width:100%; border-collapse:separate; border-spacing:0 }
@media (max-width:768px){
  .table.rwd thead{ display:none; }
  .table.rwd tr{ display:block; border:1px solid #e1e5ea; border-radius:10px; padding:8px; margin-bottom:10px; background:#fff; }
  .table.rwd td{
    display:flex; justify-content:space-between; gap:10px;
    border-bottom:1px dashed #e1e5ea; padding:8px 6px;
  }
  .table.rwd td:last-child{ border-bottom:none; }
  .table.rwd td::before{ content:attr(data-label); font-weight:600; color:#5b636a; }
  .txt-right{ text-align:right; }
}
.table-actions{ display:flex; justify-content:center; margin-top:10px; }

/* ===== Income form tweaks ===== */
.form-row .form-control,
.form-row .custom-select{
  height: calc(1.5em + .75rem + 2px);
  padding: .375rem .5rem;
  font-size: .9rem;                  /* по‑компактни полета */
}
#iNote.form-control{
  padding: .5rem .75rem;
  font-size: 1rem;                   /* по‑голямо описание */
}
@media (min-width: 992px){
  /* бутонът да стои вдясно на същия ред */
  .form-row .submit-right{ display:flex; align-items:flex-end; justify-content:flex-end; }
}


/* ===== Buttons overrides ===== */
.btn{
  font-size: .8rem;       /* по-малък шрифт */
  font-weight: 600;
  text-transform: uppercase;
  white-space: nowrap;    /* да не пренася на нов ред */
  padding: .375rem .75rem;
  border-radius: 6px;
}

/* Цветове */
.btn-primary{
  background-color:#3f6ad8;
  border-color:#3f6ad8;
}
.btn-primary:hover{ background-color:#345cc4; border-color:#345cc4; }

.btn-success{
  background-color:#3ac47d;
  border-color:#3ac47d;
  color:#fff;
}
.btn-success:hover{ background-color:#32a86b; border-color:#32a86b; }

.btn-danger{
  background-color:#d92550;
  border-color:#d92550;
  color:#fff;
}
.btn-danger:hover{ background-color:#b71f43; border-color:#b71f43; }
/* Buttons: еднаква височина като input полетата */
.btn{
  font-size: .8rem;
  font-weight: 600;
  text-transform: uppercase;
  white-space: nowrap;
  border-radius: 6px;
  height: calc(1.5em + .75rem + 2px);   /* колкото е и при form-control */
  line-height: 1.5;
  padding: .375rem .75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
/* ===== FINAL BUTTON OVERRIDES (stick to the end) ===== */
.card .form-row .submit-right > .btn,
form .btn{
  height: calc(1.5em + .75rem + 2px);
  line-height: 1.5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: .8rem;
  font-weight: 700;
  text-transform: uppercase;
  white-space: nowrap;
  letter-spacing: .02em;
  border-radius: 6px;
  padding: .375rem .75rem;
  min-width: 110px;
}

/* Цветове (по-специфични селектори + !important, за да бият всичко) */
.card .form-row .submit-right > .btn.btn-success,
form .btn.btn-success{
  background-color:#3ac47d !important;
  border-color:#3ac47d !important;
  color:#fff !important;
}
.card .form-row .submit-right > .btn.btn-danger,
form .btn.btn-danger{
  background-color:#d92550 !important;
  border-color:#d92550 !important;
  color:#fff !important;
}
.card .form-row .submit-right > .btn.btn-primary,
form .btn.btn-primary{
  background-color:#3f6ad8 !important;
  border-color:#3f6ad8 !important;
  color:#fff !important;
}
/* === Income form button polish (final) === */
.card .form-row .submit-right { 
  display:flex; align-items:flex-end; justify-content:flex-end;
}

/* разстояние между "Описание" и бутона */
#iNote.form-control { margin-right:8px; }

/* бутон: еднаква височина с input/select + не се чупи на 2 реда */
.card .form-row .submit-right > .btn{
  height: calc(2em + .75rem + 2px) !important;
  line-height: 1.5 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: .78rem !important;      /* още малко по-малък шрифт */
  font-weight: 800 !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  letter-spacing: .02em !important;
  border-radius: 6px !important;
  padding: .375rem .9rem !important; /* малко по-широк отстрани */
  min-width: 90px !important;       /* да побира ДОБАВИ на 1 ред */
}

/* по-жив зелен цвят + hover и сянка */
.card .form-row .submit-right > .btn.btn-success{
  background-color:#27c06b !important;
  border-color:#27c06b !important;
  color:#fff !important;
  box-shadow: 0 2px 6px rgba(39,192,107,.25);
}
.card .form-row .submit-right > .btn.btn-success:hover{
  background-color:#21a85d !important;
  border-color:#21a85d !important;
}
/* Действия в таблици */
.table-action{
  margin:0 4px;
  font-size:1rem;
  cursor:pointer;
  text-decoration:none;
}
.table-action.edit{ color:#3f6ad8; }   /* синьо моливче */
.table-action.delete{ color:#d92550; } /* червено кошче */
.table-action:hover{ opacity:.75; }
.txt-center{ text-align:center; }

/* Действия в таблици */
.table-action{ margin:0 4px; font-size:1rem; cursor:pointer; text-decoration:none; }
.table-action.edit{ color:#3f6ad8; }
.table-action.delete{ color:#d92550; }
.table-action:hover{ opacity:.75; }

/* центриране */
.txt-center{ text-align:center; }
@media (max-width: 768px){
  .table.rwd td.txt-center{ justify-content:center; text-align:center; }
}







/* ===== Mobile sidebar scrolling fix ===== */
@media (max-width: 992px){
  /* оф‑канвас менюто да заема целия екран под хедъра и да се скролва */
  .app-sidebar{
    position: fixed;
    top: 60px;          /* височината на мобилния header */
    left: -260px;       /* скрито по подразбиране */
    width: 260px;
    bottom: 0;
    height: auto;
    background: #fff;
    border-right: 1px solid #e1e5ea;
    overflow-y: auto;                 /* важен скрол */
    -webkit-overflow-scrolling: touch;
    z-index: 900;
    transition: left .28s ease;
  }
  .app-sidebar.open{ left: 0; }

  .app-sidebar .sidebar-scroll{
    height: 100%;
    overflow-y: auto;                 /* вътрешен скрол */
    -webkit-overflow-scrolling: touch;
    padding: 10px 0 90px;             /* място долу за „Изход“ */
  }

  /* бекдропът да не покрива хедъра */
  #sidebarBackdrop{
    position: fixed;
    top: 60px;
    left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,.35);
    display: none;
    z-index: 800;
  }
  #sidebarBackdrop.show{ display:block; }

  /* когато менюто е отворено – забраняваме скрола на фона, но позволяваме на менюто */
  body.has-sidebar-open{
    overflow: hidden;
    touch-action: none;
  }
  body.has-sidebar-open .app-sidebar{
    touch-action: auto;
  }
}

/* Desktop: sidebar видим, не е фиксиран с left:-260px */
@media (min-width: 993px){
  .app-sidebar{
    position: fixed;
    top: 0;
    left: 0;
    width: 260px;
    bottom: 0;
    overflow-y: auto;
  }
  #sidebarBackdrop{ display:none !important; }
}
