/* =========================================================
   BEACON REWARDS — FINAL CLEAN LIGHT CSS
   Single theme • Turkish only • No legacy blocks
========================================================= */

/* ================= ROOT ================= */

:root{
  --primary:#00587C;
  --primary-dark:#0b3f56;
  --accent:#F1B434;

  --bg-main:#f4f8fb;
  --bg-card:#ffffff;
  --bg-header:#ffffff;
  --bg-footer:#0f172a;

  --text-main:#0f172a;
  --text-soft:#5b6b7c;

  --border-soft:#e2e8f0;

  --radius:14px;
  --radius-sm:10px;

  --shadow-soft:0 10px 24px rgba(15,23,42,.08);
  --shadow-hover:0 16px 34px rgba(15,23,42,.14);

  --transition:.22s ease;
}

/* ================= GLOBAL ================= */

*{box-sizing:border-box}

body{
  margin:0;
  background:var(--bg-main);
  color:var(--text-main);
  font-family:"Segoe UI",system-ui,-apple-system,sans-serif;
}

img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}

/* ================= HEADER ================= */

.bcn-header{
  height:96px;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 28px;
  border-bottom:1px solid var(--border-soft);
  box-shadow:0 4px 18px rgba(15,23,42,.05);
}

.header-left{display:flex;align-items:center;gap:14px}

.header-logo{
  max-width:75px;
  height:auto;
}

.header-right{display:flex;gap:18px;align-items:center}

.menu-link{
  font-size:13px;
  font-weight:700;
  letter-spacing:.8px;
  text-transform:uppercase;
  color:var(--text-soft);
}

.menu-link:hover{color:var(--primary)}

.menu-sep{opacity:.4}

/* ================= MAIN WRAPS ================= */

.index-main,
.dashboard-main,
.points-main,
.profile-main,
.settings-main,
.update-main{
  padding:42px 20px;
}

.index-main{text-align:center}

/* ================= CARD BASE ================= */

.card,
.dash-card,
.reward-card,
.profile-card,
.settings-card,
.update-card,
.points-total-card,
.history-item{
  background:#fff;
  border-radius:var(--radius);
  border:1px solid var(--border-soft);
  box-shadow:var(--shadow-soft);
  transition:var(--transition);
}

.card:hover,
.dash-card:hover,
.reward-card:hover,
.profile-card:hover,
.settings-card:hover,
.update-card:hover,
.history-item:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow-hover);
}

/* ================= INDEX ================= */

.loyalty-cards{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  justify-content:center;
}

.card{
  width:280px;
  padding:26px 22px 30px;
  text-align:center;
}

.card-title{
  font-size:20px;
  font-weight:700;
  margin-bottom:8px;
  color:var(--primary);
}

.card-desc{
  font-size:14px;
  line-height:1.45;
  color:var(--primary);
  opacity:.9;
}

.card-icon{
  width:88px;
  margin:0 auto 14px;
}

/* ================= BUTTONS ================= */

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:9px 16px;
  border-radius:10px;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  transition:var(--transition);
}

.btn-primary{
  background:var(--accent);
  border:2px solid var(--primary);
  color:#fff;
}

.btn-primary:hover{background:#e0a62b}

.btn-outline{
  background:#fff;
  border:2px solid var(--primary);
  color:var(--primary);
}

.btn-outline:hover{
  background:var(--primary);
  color:#fff;
}

.index-buttons{
  margin-top:28px;
  display:flex;
  gap:14px;
  justify-content:center;
  flex-wrap:wrap;
}

/* ================= FORMS ================= */

.login-main{
  min-height:calc(100vh - 96px);
  display:flex;
  align-items:center;
  justify-content:center;
}

.login-card{
  width:100%;
  max-width:460px;
  padding:34px;
  text-align:center;
}

.login-title{
  font-size:22px;
  font-weight:800;
  color:var(--primary-dark);
  margin-bottom:22px;
}

.login-form{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.login-label{
  text-align:left;
  font-size:13px;
  font-weight:700;
  color:var(--text-soft);
}

input,select,textarea{
  width:100%;
  padding:12px 14px;
  border-radius:12px;
  border:1px solid var(--border-soft);
  font-size:14px;
  background:#fff;
}

input:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(0,88,124,.15);
}

/* ================= DASHBOARD ================= */

.dashboard-title{
  font-size:26px;
  font-weight:800;
  color:var(--primary-dark);
  margin-bottom:26px;
}

.dashboard-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:20px;
  max-width:1000px;
  margin:0 auto;
}

.dash-card{
  padding:26px;
  text-align:center;
}

.dash-icon{
  font-size:36px;
  margin-bottom:10px;
  color:var(--primary);
}

.dash-label{
  font-size:18px;
  font-weight:800;
}

.dash-desc{
  font-size:13px;
  color:var(--text-soft);
}

.dashboard-back{
  margin-top:32px;
  text-align:center;
}

/* ================= POINTS ================= */

.points-title{
  font-size:26px;
  font-weight:800;
  color:var(--primary-dark);
  text-align:center;
  margin-bottom:26px;
}

.tier-card{
  position:relative;
  padding:40px 28px 60px;
  min-height:260px;
  max-width:420px;
  margin:0 auto 30px;
}

.tier-icon{
  position:absolute;
  left:22px;
  top:22px;
  width:64px;
}

.tier-points-big{
  position:absolute;
  right:22px;
  top:18px;
  font-size:42px;
  font-weight:900;
  color:var(--primary);
}

.tier-center-status{
  text-align:center;
  font-size:22px;
  font-weight:900;
  margin-top:52px;
}

.tier-progress-bar{
  height:12px;
  background:#e2e8f0;
  border-radius:8px;
  overflow:hidden;
}

.tier-progress-fill{
  height:100%;
  background:var(--accent);
}

.tier-progress-text{
  margin-top:8px;
  font-size:11px;
  font-weight:800;
  color:var(--primary);
  text-align:left;
}

.tier-meta{
  position:absolute;
  left:22px;
  bottom:14px;
  font-size:12px;
  opacity:.7;
}

.tier-user{
  position:absolute;
  right:22px;
  bottom:12px;
  border:2px solid var(--primary);
  border-radius:10px;
  padding:4px 10px;
  font-weight:700;
}

.history-item{
  border:1px solid var(--primary);
  border-radius:12px;
  padding:12px 14px;
  background:#fff;
}

/* ================= REWARDS ================= */

.rewards-grid{
  max-width:920px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:18px;
}

.reward-card{
  padding:20px;
  text-align:center;
}

.reward-icon{font-size:32px;color:var(--primary)}
.reward-title{font-weight:800}

.reward-cost{
  font-size:15px;
  color:var(--primary);
}

.reward-cost strong{
  font-size:18px;
  font-weight:900;
}

/* ================= PROFILE / SETTINGS ================= */

.profile-card,
.settings-card,
.update-card{
  max-width:560px;
  margin:0 auto;
  padding:28px;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.profile-item,
.settings-item{
  padding:12px 14px;
  border-radius:12px;
  background:#f8fafc;
  border:1px solid var(--border-soft);
}

.profile-value,
.settings-value{
  font-weight:700;
}

.profile-icon{
  font-size:44px;
  color:var(--primary);
  margin-bottom:8px;
}

/* ================= RECEIPT FORM ================= */

.receipt-form{
  max-width:420px;
  margin:0 auto;
  border:2px solid var(--primary);
  border-radius:14px;
  padding:26px;
  background:#fff;
}

/* ================= FOOTER ================= */

.bcn-footer{
  background:#0f172a;
  color:#cbd5e1;
  padding:22px 28px;
  margin-top:60px;
  display:flex;
  justify-content:space-between;
}

.footer-right{
  display:flex;
  gap:14px;
}

.footer-right a{
  text-transform:capitalize;
  font-weight:700;
}

/* ================= MOBILE ================= */

@media (max-width:640px){

  .bcn-header{height:84px;padding:0 16px}
  .dashboard-title,.points-title{font-size:22px}
  .btn{width:100%}

}

/* ================= ADMIN TABLE ================= */

.admin-main{
  padding:40px 24px;
  max-width:1100px;
  margin:0 auto;
}

.admin-title{
  font-size:26px;
  font-weight:800;
  color:var(--primary-dark);
  margin-bottom:22px;
}

.admin-table-wrap{
  background:#fff;
  border:1px solid var(--border-soft);
  border-radius:14px;
  box-shadow:var(--shadow-soft);
  overflow:auto;
}

.admin-table{
  width:100%;
  border-collapse:collapse;
  min-width:680px;
}

.admin-table thead{
  background:#f1f5f9;
}

.admin-table th{
  text-align:left;
  font-size:13px;
  letter-spacing:.4px;
  text-transform:uppercase;
  color:var(--text-soft);
  padding:14px 16px;
  border-bottom:1px solid var(--border-soft);
}

.admin-table td{
  padding:14px 16px;
  border-bottom:1px solid #eef2f7;
  font-size:14px;
}

.admin-table tbody tr:hover{
  background:#f8fafc;
}

.admin-table td:first-child{
  font-weight:700;
  color:var(--primary);
}

.admin-back{
  margin-top:22px;
  text-align:right;
}

/* ===== ADMIN SEARCH ===== */

.admin-search{
  display:flex;
  gap:10px;
  margin-bottom:16px;
}

.admin-search input{
  max-width:260px;
}

/* ===== SMALL BUTTON ===== */

.btn-sm{
  padding:6px 10px;
  font-size:12px;
}

/* ===== INLINE FORM ===== */

.inline-form{
  display:flex;
  gap:6px;
  align-items:center;
}

.delta-input{
  width:70px;
  padding:6px 8px;
  font-size:12px;
}

/* ===== QUICK DELTA ===== */

.quick-delta{
  margin-top:6px;
  display:flex;
  gap:8px;
  font-size:12px;
}

.quick-delta a{
  color:var(--primary);
  font-weight:700;
}

/* ===== PAGINATION ===== */

.admin-pages{
  margin-top:18px;
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}

.page-btn{
  padding:6px 10px;
  border:1px solid var(--border-soft);
  border-radius:8px;
}

.page-btn.active{
  background:var(--primary);
  color:#fff;
  border-color:var(--primary);
}
/* ===== ADMIN MODAL ===== */

.admin-modal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:999;
}

.admin-modal-box{
  background:#fff;
  width:520px;
  max-width:95%;
  border-radius:14px;
  padding:22px;
  box-shadow:0 30px 80px rgba(0,0,0,.25);
}

.admin-modal-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:14px;
}

.modal-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-bottom:14px;
}

.modal-history{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.modal-row{
  display:flex;
  justify-content:space-between;
  background:#f8fafc;
  padding:8px 10px;
  border-radius:8px;
}

.hidden{display:none}

.modal-adjust{
  display:flex;
  gap:8px;
  margin:10px 0 14px;
}
.modal-adjust input{
  width:90px;
}

.admin-kpi-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:16px;
  margin-bottom:24px;
}

.kpi-card{
  background:#fff;
  padding:18px;
  border-radius:14px;
  box-shadow:var(--shadow-soft);
  font-size:14px;
}

.kpi-card strong{
  font-size:26px;
  color:var(--primary);
}

.admin-chart-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
}

.admin-chart-grid canvas{
  background:#fff;
  padding:16px;
  border-radius:14px;
  box-shadow:var(--shadow-soft);
}

.admin-back-fixed{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:50;
}
/* ===== ADMIN HEADER ===== */

.admin-header{
  height:64px;
  background:#0f172a;
  color:#e2e8f0;

  display:flex;
  align-items:center;
  justify-content:space-between;

  padding:0 22px;
  margin-bottom:28px;
}

.admin-header-left{
  font-size:18px;
  font-weight:700;
}

.admin-header-nav{
  display:flex;
  gap:18px;
}

.admin-header-nav a{
  color:#cbd5e1;
  font-size:14px;
  font-weight:600;
  opacity:.9;
}

.admin-header-nav a:hover{
  color:#ffffff;
}

.admin-header-right{
  display:flex;
  align-items:center;
  gap:14px;
}

.admin-user{
  font-size:13px;
  opacity:.85;
}

/* ===== ADMIN FOOTER ===== */

.admin-footer{
  margin-top:40px;
  padding:18px 22px;

  border-top:1px solid #e2e8f0;

  display:flex;
  justify-content:space-between;
  align-items:center;

  font-size:13px;
  color:#64748b;
}

.admin-footer-right{
  opacity:.8;
}

/* =====================================================
   ADMIN MOBILE UPGRADE
===================================================== */

@media (max-width: 768px){

/* ===== HEADER ===== */

.admin-header{
  height:auto;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  padding:14px 16px;
}

.admin-header-nav{
  flex-wrap:wrap;
  gap:12px;
}

.admin-header-nav a{
  font-size:15px;
}

/* ===== MAIN ===== */

.admin-main{
  padding:22px 14px !important;
}

/* ===== TITLES ===== */

.admin-title{
  font-size:22px;
}

/* ===== KPI GRID ===== */

.admin-kpi-grid{
  grid-template-columns:1fr;
}

.kpi-card strong{
  font-size:28px;
}

/* ===== CHART GRID ===== */

.admin-chart-grid{
  grid-template-columns:1fr;
}

/* ===== TABLE → CARD MODE ===== */

.admin-table-wrap{
  overflow:visible;
}

.admin-table{
  border:none;
}

.admin-table thead{
  display:none;
}

.admin-table tr{
  display:block;
  background:#fff;
  border-radius:14px;
  padding:14px;
  margin-bottom:14px;
  box-shadow:var(--shadow-soft);
}

.admin-table td{
  display:flex;
  justify-content:space-between;
  padding:8px 0;
  border:none;
  font-size:14px;
}

.admin-table td::before{
  content:attr(data-label);
  font-weight:700;
  color:#64748b;
}

/* ===== SEARCH ===== */

.admin-search{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.admin-search input{
  font-size:16px;
  padding:14px;
}

/* ===== BUTTONS ===== */

.btn,
.btn-sm{
  font-size:15px;
  padding:12px 14px;
}

/* ===== PAGINATION ===== */

.admin-pages{
  flex-wrap:wrap;
  gap:8px;
}

/* ===== FOOTER ===== */

.admin-footer{
  flex-direction:column;
  gap:6px;
  text-align:center;
}

/* ===== FIXED BACK BUTTON ===== */

.admin-back-fixed{
  right:12px;
  bottom:12px;
}

}

/* ===== ADMIN MOBILE DASHBOARD ===== */

@media (max-width:768px){

.admin-mobile-title{
  font-size:24px;
  margin-bottom:18px;
}

.admin-mobile-grid{
  grid-template-columns:1fr !important;
  gap:16px;
}

.admin-mobile-grid .dash-card{
  padding:22px;
}

.admin-mobile-grid .dash-icon{
  font-size:42px;
}

.admin-mobile-grid .dash-label{
  font-size:18px;
}

.admin-mobile-grid .dash-desc{
  font-size:14px;
}

}

.chart-card{
  background:#fff;
  padding:14px;
  border-radius:14px;
  box-shadow:var(--shadow-soft);
  height:280px;
}

@media(max-width:768px){
  .chart-card{ height:240px; }
}

/* ===== ADMIN LOGIN MOBILE ===== */

.admin-login-main{
  padding:24px 16px;
}

.admin-login-card{
  max-width:520px;
  width:100%;
}

@media(max-width:768px){

  .admin-login-card{
    padding:26px 20px 30px;
  }

  .admin-login-card input{
    font-size:16px;
    padding:14px;
  }

  .admin-login-card .btn{
    font-size:16px;
    padding:14px;
  }

}
/* =========================
   ADMIN HEADER + BURGER
========================= */

.admin-header{
  height:64px;
  background:#ffffff;
  border-bottom:1px solid var(--border-soft);
  display:flex;
  align-items:center;
  padding:0 16px;
  position:sticky;
  top:0;
  z-index:50;
}

/* logo solda kalsın */
.admin-header-left{
  display:flex;
  align-items:center;
}

.admin-logo{
  font-weight:800;
  font-size:18px;
  color:#00587C;
}

/* desktop nav ortada büyüsün */
.admin-nav{
  display:flex;
  gap:18px;
  font-weight:600;
  margin-left:24px;
}

.admin-nav a{
  color:#475569;
}

.admin-nav a:hover{
  color:#00587C;
}

/* hamburger sağa itilsin */
.admin-burger{
  font-size:24px;
  background:none;
  border:none;
  cursor:pointer;
  margin-left:auto;   /* 🔴 kritik satır */
}

/* ===== drawer ===== */

.admin-drawer{
  position:fixed;
  top:0;
  right:-280px;
  width:260px;
  height:100%;
  background:#ffffff;
  box-shadow:-10px 0 30px rgba(0,0,0,.12);
  transition:.25s ease;
  z-index:60;
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:18px;
}

.admin-drawer.open{
  right:0;
}

.admin-drawer-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:16px;
}

.admin-drawer-nav{
  display:flex;
  flex-direction:column;
  gap:14px;
  font-weight:600;
}

.admin-drawer-nav a{
  padding:10px;
  border-radius:10px;
}

.admin-drawer-nav a:hover{
  background:#f1f5f9;
}

.admin-drawer-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.35);
  opacity:0;
  pointer-events:none;
  transition:.2s;
  z-index:55;
}

.admin-drawer-overlay.open{
  opacity:1;
  pointer-events:auto;
}

/* ===== responsive ===== */

.desktop-only{display:flex}
.mobile-only{display:none}

@media (max-width:768px){
  .desktop-only{display:none}
  .mobile-only{display:block}
}

/* =========================
   ADMIN USERS — MOBILE COMPACT
========================= */

@media (max-width:768px){

  .admin-table td{
    padding:8px 10px;
    font-size:13px;
  }

  .admin-table td::before{
    font-size:11px;
    margin-bottom:2px;
  }

  /* puan hücresi */
  .pts-cell strong{
    font-size:16px;
  }

  /* işlem hücresi sıkıştır */
  .admin-table td[data-label=İşlem]{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
  }

  /* detay buton küçült */
  .admin-table .btn-sm{
    padding:6px 10px;
    font-size:12px;
  }

  /* quick delta yatay yap */
  .quick-delta{
    display:flex;
    gap:8px;
  }

  .quick-delta a{
    font-size:12px;
    padding:4px 8px;
    border:1px solid #cbd5e1;
    border-radius:8px;
  }

  /* satır kart padding azalt */
  .admin-table tr{
    padding:10px 10px 12px;
  }

}

/* =====================================
   ADMIN USERS — HARD MOBILE COMPACT
===================================== */

@media (max-width:768px){

  .admin-table-wrap{
    padding:0;
  }

  .admin-table{
    border:0;
  }

  .admin-table thead{
    display:none !important;
  }

  .admin-table tr{
    display:block !important;
    border:1px solid #e2e8f0;
    border-radius:12px;
    margin-bottom:10px;
    padding:8px 10px !important;
    background:#fff;
  }

  .admin-table td{
    display:grid !important;
    grid-template-columns:90px 1fr;
    gap:6px;
    padding:4px 0 !important;
    font-size:13px !important;
    line-height:1.2 !important;
    min-height:unset !important;
  }

  .admin-table td::before{
    content:attr(data-label);
    font-weight:700;
    font-size:11px;
    color:#64748b;
  }

  /* işlem hücresi özel layout */
  .admin-table td[data-label=İşlem]{
    display:flex !important;
    gap:8px;
    align-items:center;
    flex-wrap:nowrap;
  }

  /* detay buton mini */
  .admin-table .btn-sm{
    padding:5px 9px !important;
    font-size:12px !important;
    height:28px;
  }

  /* quick delta chip */
  .quick-delta{
    display:flex !important;
    gap:6px;
  }

  .quick-delta a{
    font-size:11px;
    padding:3px 7px;
    border-radius:999px;
    border:1px solid #cbd5e1;
    background:#f8fafc;
  }

  /* puan daha kompakt */
  .pts-cell strong{
    font-size:15px !important;
  }

}

/* =====================================
   ADMIN MOBILE — FORCE FULL WIDTH
===================================== */

@media (max-width:768px){

  .admin-main{
    padding:14px 10px !important;
    max-width:100% !important;
  }

  .admin-table-wrap{
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
  }

  .admin-table{
    width:100% !important;
    table-layout:fixed;
  }

  .admin-table tr{
    width:100% !important;
    margin:0 0 10px 0 !important;
  }

  /* grid kolon oranı da genişlet */
  .admin-table td{
    grid-template-columns:110px 1fr !important;
  }

}
@media (max-width:768px){

  main,
  .dashboard-main,
  .admin-main{
    margin:0 !important;
    max-width:none !important;
  }

}
/* =========================
   ADMIN FULL LAYOUT OVERRIDE
========================= */

.admin-full{
  max-width:none !important;
  width:100% !important;
  margin:0 !important;
  padding:18px 12px !important;
}

/* admin tablolar full width */

.admin-full .admin-table-wrap{
  width:100% !important;
  max-width:100% !important;
}

.admin-full .admin-table{
  width:100% !important;
}

/* mobilde daha da geniş */

@media (max-width:768px){

  .admin-full{
    padding:14px 10px !important;
  }

}
@media (max-width:768px){
  .admin-table .btn{
    width:100%;
  }
}

/* =====================================================
   ADMIN MOBILE FINAL OVERRIDE — CLEAN
   (must be LAST in file)
===================================================== */

@media (max-width:768px){

/* ===== layout full width ===== */

.admin-main{
  max-width:none !important;
  width:100% !important;
  margin:0 !important;
  padding:16px 10px !important;
}

.admin-table-wrap{
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  border-radius:12px !important;
}

/* ===== table → card ===== */

.admin-table{
  min-width:0 !important;
  width:100% !important;
}

.admin-table thead{
  display:none !important;
}

.admin-table tr{
  display:block !important;
  width:100% !important;

  margin:0 0 12px 0 !important;
  padding:12px !important;

  border:1px solid #e2e8f0 !important;
  border-radius:14px !important;

  background:#ffffff !important;
  box-shadow:0 8px 18px rgba(0,0,0,.06) !important;
}

/* ===== cell layout ===== */

.admin-table td{
  display:grid !important;
  grid-template-columns:100px 1fr !important;

  gap:8px !important;

  padding:6px 0 !important;
  border:none !important;

  font-size:14px !important;
  line-height:1.25 !important;
}

.admin-table td::before{
  content:attr(data-label) !important;
  font-weight:800 !important;
  font-size:12px !important;
  color:#64748b !important;
}

/* ===== points ===== */

.pts-cell strong{
  font-size:18px !important;
}

/* ===== işlem satırı ===== */

.admin-table td[data-label=İşlem]{
  display:flex !important;
  gap:10px !important;
  align-items:center !important;
  flex-wrap:wrap !important;
}

/* ===== buttons ===== */

.admin-table .btn,
.admin-table .btn-sm{
  width:100% !important;
  padding:10px 12px !important;
  font-size:14px !important;
  height:auto !important;
}

/* ===== quick delta ===== */

.quick-delta{
  display:flex !important;
  gap:10px !important;
}

.quick-delta a{
  padding:6px 10px !important;
  border-radius:999px !important;
  border:1px solid #cbd5e1 !important;
  background:#f1f5f9 !important;
  font-size:12px !important;
  font-weight:700 !important;
}

/* ===== search ===== */

.admin-search{
  flex-direction:column !important;
}

.admin-search input{
  width:100% !important;
  font-size:16px !important;
  padding:14px !important;
}

/* ===== charts ===== */

.admin-chart-grid{
  grid-template-columns:1fr !important;
}

/* ===== KPI ===== */

.admin-kpi-grid{
  grid-template-columns:1fr !important;
}

/* ===== fixed back ===== */

.admin-back-fixed{
  right:12px !important;
  bottom:12px !important;
}

}

/* =====================================================
   DOWNLOAD APP — STORE STYLE BUTTONS
===================================================== */

.app-download{
  margin-top:18px;
  display:flex;
  flex-direction:column;
  gap:12px;
  align-items:center;
}

/* store badge style */

.store-btn{
  width:240px;
  height:52px;
  border-radius:14px;
  border:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  font-weight:700;
  font-size:14px;
  letter-spacing:.3px;

  background:#000;
  color:#fff;

  box-shadow:0 6px 18px rgba(0,0,0,.18);
  transition:.18s ease;
}

.store-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 26px rgba(0,0,0,.22);
  opacity:.95;
}

.store-btn svg{
  width:22px;
  height:22px;
  fill:#fff;
}

/* android slightly darker */

.store-android{
  background:#000;
}

/* ios */

.store-ios{
  background:#111;
}

/* mobile */

@media (max-width:640px){
  .store-btn{
    width:100%;
    max-width:320px;
  }
}