/* TailAdmin-like corporate UI (Bootstrap 5) */
:root{
  --ta-bg:#f7f8fa;
  --ta-surface:#ffffff;
  --ta-border:#e6e8ef;
  --ta-text:#111827;
  --ta-muted:#6b7280;
  --ta-primary:#3c50e0; /* close to sample */
  --ta-primary-weak: rgba(60,80,224,.10);
  --ta-shadow: 0 10px 30px rgba(17,24,39,.06);
  --ta-radius: 14px;
}

html,body{height:100%}
body.ta{background:var(--ta-bg); color:var(--ta-text);}

.ta-shell{min-height:100vh; display:flex;}
.ta-sidebar{
  width: 280px;
  background: var(--ta-surface);
  border-right: 1px solid var(--ta-border);
  padding: 18px 14px;
  display:flex;
  flex-direction:column;
}
.ta-brand{
  font-weight: 800;
  font-size: 18px;
  letter-spacing: .2px;
  padding: 6px 10px 14px;
}
.ta-section{
  margin-top: 14px;
  font-size: 11px;
  color: var(--ta-muted);
  text-transform: uppercase;
  letter-spacing: .08em;
  padding: 0 10px;
}
.ta-nav{margin-top: 8px;}
.ta-nav a{
  display:flex; align-items:center; gap:10px;
  padding: 10px 10px;
  border-radius: 12px;
  color: var(--ta-text);
  text-decoration:none;
}
.ta-nav a:hover{background:#f3f4f6;}
.ta-nav a.active{
  background: var(--ta-primary-weak);
  color: var(--ta-primary);
  font-weight: 600;
}
.ta-nav i{font-size:18px; opacity:.9;}

.ta-main{flex:1; padding: 18px 22px 34px;}
.ta-topbar{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding: 14px 16px;
  background: var(--ta-surface);
  border: 1px solid var(--ta-border);
  border-radius: var(--ta-radius);
  box-shadow: var(--ta-shadow);
}
.ta-topbar-left{min-width: 220px;}
.ta-title{font-weight:800; font-size:16px; line-height:1.1;}
.ta-subtitle{color:var(--ta-muted); font-size:12px; margin-top:4px;}
.ta-search{
  display:flex; align-items:center; gap:10px;
  background:#f3f4f6;
  border: 1px solid #eef0f4;
  border-radius: 12px;
  padding: 10px 12px;
  min-width: min(520px, 100%);
}
.ta-search input{
  border:0; outline:0; background:transparent; width:100%;
}
.ta-actions{display:flex; align-items:center; gap:10px;}

.ta-page{
  margin-top: 16px;
}
.ta-page-narrow{max-width: 1100px;}

.alert{border-radius: 12px;}
.badge{border-radius: 999px;}
.ta-avatar{
  width: 36px; height:36px; border-radius: 999px;
  background: linear-gradient(135deg, var(--ta-primary), #22c55e);
}

.ta-page{margin-top: 16px;}
.ta-card{
  background: var(--ta-surface);
  border: 1px solid var(--ta-border);
  border-radius: var(--ta-radius);
  box-shadow: var(--ta-shadow);
}
.ta-card-header{
  padding: 14px 16px;
  border-bottom: 1px solid var(--ta-border);
  display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.ta-card-body{padding: 16px;}

.ta-stat{
  padding: 16px;
  border-radius: var(--ta-radius);
  border: 1px solid var(--ta-border);
  background: var(--ta-surface);
  box-shadow: var(--ta-shadow);
}
.ta-stat .label{color:var(--ta-muted); font-size:12px;}
.ta-stat .value{font-size:26px; font-weight:800; margin-top:6px;}

.btn-ta{
  border-radius: 12px;
  border: 1px solid var(--ta-border);
  background: var(--ta-surface);
  color: var(--ta-text);
}
.btn-ta:hover{background:#f9fafb;}
.btn-ta-primary{
  border-radius: 12px;
  border: 1px solid rgba(60,80,224,.35);
  background: var(--ta-primary);
  color: #fff;
}
.btn-ta-primary:hover{filter: brightness(1.03);}

.table.ta-table thead th{color:var(--ta-muted); font-weight:600; border-bottom-color: var(--ta-border);}
.table.ta-table td, .table.ta-table th{border-color: var(--ta-border);}
.table.ta-table > :not(caption) > * > *{
  padding: 14px 16px; /* force consistent padding (overrides table-sm) */
}
.table.ta-table thead th{
  padding-top: 12px;
  padding-bottom: 12px;
}
.table.ta-table thead th{
  background:#f9fafb;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.table.ta-table tbody tr:hover{
  background:#fbfcff;
}
.table.ta-table td{ vertical-align: middle; }

/* Dropdown inside scroll containers */
.table-responsive{ overflow: visible; }
.dropdown-menu{ z-index: 1080; }
.ta-kebab{
  width: 34px; height: 34px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius: 10px;
  border:1px solid var(--ta-border);
  background: var(--ta-surface);
  color: var(--ta-muted);
}
.ta-kebab:hover{background:#f9fafb}
.dropdown-menu{
  border-radius: 12px;
  border: 1px solid var(--ta-border);
  box-shadow: var(--ta-shadow);
}
.dropdown-item{padding: 10px 12px;}
.ta-badge{
  display:inline-flex;
  align-items:center;
  padding: 6px 10px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 12px;
}
.ta-badge-success{background: rgba(34,197,94,.12); color:#15803d;}
.ta-badge-warning{background: rgba(245,158,11,.14); color:#92400e;}
.ta-badge-danger{background: rgba(239,68,68,.12); color:#991b1b;}
.ta-badge-muted{background: rgba(107,114,128,.12); color:#374151;}

.form-control,.form-select{
  border-radius: 12px;
  border: 1px solid var(--ta-border);
}
.form-control:focus,.form-select:focus{
  box-shadow: 0 0 0 .25rem rgba(60,80,224,.12);
  border-color: rgba(60,80,224,.45);
}

/* Auth */
.ta-auth-wrap{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px;}
.ta-auth-card{width:100%; max-width:520px;}