/* =========================================================
   Project NICESO Brand Theme v1.9.3
   Visual-only layer. No workflow or database changes.
========================================================= */
:root{
  --niceso-red:#ed1c24;
  --niceso-red-dark:#c91018;
  --niceso-red-deep:#9f0d14;
  --niceso-red-soft:#fff0f1;
  --niceso-charcoal:#202124;
  --niceso-charcoal-2:#17181b;
  --niceso-gray:#f4f5f7;
  --niceso-line:#e3e5e8;
  --yellow:var(--niceso-red);
  --yellow-soft:var(--niceso-red-soft);
  --ink:#202124;
  --muted:#6b7280;
  --line:var(--niceso-line);
  --bg:var(--niceso-gray);
  --shadow:0 12px 34px rgba(23,24,27,.08);
}

html,body{background:var(--niceso-gray);color:var(--ink)}
body.app-page{background:
  radial-gradient(circle at 100% 0,rgba(237,28,36,.045),transparent 28%),
  var(--niceso-gray)}

/* Brand identity */
.sidebar{
  background:linear-gradient(180deg,var(--niceso-charcoal) 0%,var(--niceso-charcoal-2) 100%);
  border-right:1px solid rgba(255,255,255,.06);
  box-shadow:10px 0 30px rgba(18,19,21,.08);
}
.sidebar-brand{
  min-height:82px;
  padding:5px 8px 18px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:7px;
}
.niceso-brand-logo{
  display:block;
  width:min(196px,100%);
  height:auto;
  border-radius:8px;
  box-shadow:0 7px 20px rgba(0,0,0,.22);
}
.sidebar-brand>small{
  color:#b7bbc1;
  font-size:10px;
  font-weight:750;
  letter-spacing:.8px;
  text-transform:uppercase;
  padding-left:2px;
}
.niceso-mobile-logo{display:none;width:76px;height:auto;border-radius:5px;flex:0 0 auto}

.nav-list{overflow-x:hidden;scrollbar-gutter:stable}
.nav-list>a{
  color:#c7c9ce;
  border:1px solid transparent;
  transition:background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.nav-list>a:hover{
  color:#fff;
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.04);
}
.nav-list>a.active{
  color:#fff;
  background:linear-gradient(90deg,rgba(237,28,36,.30),rgba(237,28,36,.12));
  border-color:rgba(237,28,36,.28);
  box-shadow:inset 3px 0 var(--niceso-red),0 6px 16px rgba(0,0,0,.08);
}
.nav-section{color:#8f949b}
.sidebar-user{border-top-color:rgba(255,255,255,.10)}
.sidebar-user small{color:#a8acb2}
.avatar,.nav-count{background:var(--niceso-red);color:#fff}

/* Header */
.topbar{
  background:rgba(255,255,255,.96);
  border-bottom:1px solid var(--niceso-line);
  box-shadow:0 3px 14px rgba(23,24,27,.035);
  backdrop-filter:saturate(150%) blur(10px);
}
.topbar::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-1px;
  height:2px;
  background:linear-gradient(90deg,var(--niceso-red),rgba(237,28,36,.12) 36%,transparent 72%);
  pointer-events:none;
}
.topbar-title h1{color:#202124;letter-spacing:-.2px}
.icon-btn,.notification-btn{transition:background-color .18s ease,border-color .18s ease,transform .18s ease}
.icon-btn:hover,.notification-btn:hover{background:var(--niceso-red-soft)!important;border-color:#f3a4a8!important;color:var(--niceso-red)!important}
.notification-badge{background:var(--niceso-red)!important}

/* Main UI */
.content{background:transparent}
.card,.table-wrap,.auth-card,.modal-backdrop>div{
  border-color:var(--niceso-line);
}
.card{
  box-shadow:0 3px 14px rgba(23,24,27,.035);
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.card:hover{border-color:#d7dade;box-shadow:0 9px 26px rgba(23,24,27,.065)}
.section-head h2{color:#202124}

.btn{transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease,border-color .16s ease}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0) scale(.985)}
.btn.primary{
  color:#fff!important;
  background:linear-gradient(180deg,#f12a32 0%,var(--niceso-red) 58%,var(--niceso-red-dark) 100%)!important;
  border-color:var(--niceso-red-dark)!important;
  box-shadow:0 7px 16px rgba(237,28,36,.19);
}
.btn.primary:hover{background:linear-gradient(180deg,#f43a41,var(--niceso-red-dark))!important;box-shadow:0 9px 20px rgba(237,28,36,.25)}
.btn.dark{background:var(--niceso-charcoal)!important;color:#fff!important;border-color:var(--niceso-charcoal)!important}
.btn.ghost{background:#fff;border-color:#d9dce0;color:#25272b}
.btn.ghost:hover{background:var(--niceso-red-soft);border-color:#f0a1a6;color:var(--niceso-red-dark)}
.btn.danger{background:#fee8e9;color:#a90f16;border-color:#fac4c7}

input:focus,select:focus,textarea:focus{
  border-color:var(--niceso-red)!important;
  box-shadow:0 0 0 3px rgba(237,28,36,.14)!important;
}
input[type="checkbox"],input[type="radio"]{accent-color:var(--niceso-red)}

th{background:#f8f8f9;color:#5f6368;border-bottom-color:#e5e7eb}
tbody tr:hover td{background:#fffafb}
.progress>span{background:linear-gradient(90deg,var(--niceso-red),#ff4d55)}
.pagination .btn.current,.pagination a.active{background:var(--niceso-red);color:#fff;border-color:var(--niceso-red)}

/* Brand-aware information blocks */
.hint{background:var(--niceso-red-soft);border-color:#f6c2c5;color:#611015}
.comment{border-left-color:var(--niceso-red);background:#fffafb}
.table-wrap:focus-within{box-shadow:0 0 0 3px rgba(237,28,36,.08)}
.bulk-action-bar,[data-bulk-context].bulk-mode .table-wrap{--yellow:var(--niceso-red)}
[data-bulk-context].bulk-mode .table-wrap{box-shadow:0 0 0 3px rgba(237,28,36,.15)}
.megaphone-fab{background:var(--niceso-red)!important;color:#fff!important}
.broadcast-ticker[data-priority="important"]{background:#fff3f4;border-color:#ef9aa0}
.broadcast-ticker-label{background:var(--niceso-charcoal)}

/* Keep semantic status colors readable */
.badge.success{background:#dcfce7;color:#166534}
.badge.danger{background:#fee2e2;color:#991b1b}
.badge.warning{background:#fef3c7;color:#92400e}
.badge.info{background:#dbeafe;color:#1e40af}
.alert.warning{background:#fef3c7;color:#92400e}
.alert.success{background:#dcfce7;color:#166534}
.alert.info{background:#dbeafe;color:#1e40af}

/* Login */
.auth-page{
  background:
    radial-gradient(circle at 15% 10%,rgba(255,255,255,.14),transparent 24%),
    radial-gradient(circle at 88% 85%,rgba(237,28,36,.30),transparent 28%),
    linear-gradient(135deg,#17181b 0%,#24262a 54%,#4b1014 100%);
}
.auth-card{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.72);
  border-top:4px solid var(--niceso-red);
  box-shadow:0 24px 70px rgba(0,0,0,.28);
}
.auth-card::before{
  content:"";
  position:absolute;
  width:190px;height:190px;border-radius:50%;
  right:-105px;top:-110px;
  background:rgba(237,28,36,.08);
  pointer-events:none;
}
.niceso-auth-logo{display:block;width:min(250px,84%);height:auto;border-radius:10px;box-shadow:0 9px 24px rgba(237,28,36,.17)}
.auth-card h1{color:#202124;letter-spacing:-.45px}
.auth-card .muted{color:#72767d}
.auth-card .btn.primary{width:100%;min-height:44px}
.password-toggle{color:#5f6368}
.password-toggle:hover{color:var(--niceso-red)}

/* Scrollbars */
.sidebar,.nav-list,.table-wrap,*{
  scrollbar-color:rgba(237,28,36,.55) transparent;
}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:rgba(237,28,36,.42);border-radius:999px;border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:rgba(237,28,36,.68);background-clip:padding-box}

@media(max-width:780px){
  .topbar{display:flex;gap:9px;padding:0 12px}
  .niceso-mobile-logo{display:block}
  .topbar-title{min-width:0;flex:1}
  .topbar-title h1{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .sidebar-brand{min-height:76px}
  .niceso-brand-logo{width:180px}
  .card:hover{transform:none}
}
@media(max-width:520px){
  .niceso-mobile-logo{width:66px}
  .topbar{gap:7px}
  .topbar-title h1{font-size:15px}
  .notification-btn{width:38px!important;height:38px!important}
}
@media(max-width:390px){
  .niceso-mobile-logo{display:none}
}
@media(prefers-reduced-motion:reduce){
  .card,.btn,.nav-list>a,.icon-btn,.notification-btn{transition:none!important}
}