:root{
  --pistache:#8FAE7D; --pistache-dark:#5E7A4E; --pistache-pale:#E7F0E1;
  --gray-900:#2E332E; --gray-700:#4A4F49; --gray-400:#8B8F89;
  --gray-200:#E6E9E3; --gray-100:#F4F6F3; --white:#FFFFFF;
  --radius:14px; --shadow:0 8px 24px -10px rgba(46,51,46,.18);
  --font-display:'Sora',sans-serif; --font-body:'Inter',sans-serif; --font-mono:'JetBrains Mono',monospace;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{font-family:var(--font-body); background:var(--gray-100); color:var(--gray-900);}
a{color:inherit; text-decoration:none;}

/* ---- Login ---- */
.auth-wrap{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px;}
.auth-card{background:var(--white); border:1px solid var(--gray-200); border-radius:var(--radius); box-shadow:var(--shadow); padding:40px 36px; width:100%; max-width:380px;}
.auth-logo{font-family:var(--font-display); font-weight:700; font-size:20px; margin-bottom:6px;}
.auth-logo b{color:var(--pistache-dark);}
.auth-sub{color:var(--gray-400); font-size:13.5px; margin-bottom:28px;}
.field{margin-bottom:16px;}
.field label{display:block; font-size:12.5px; font-weight:600; color:var(--gray-700); margin-bottom:6px;}
.field input,.field select,.field textarea{
  width:100%; padding:10px 12px; border:1.5px solid var(--gray-200); border-radius:9px;
  font-family:var(--font-body); font-size:14px; background:var(--gray-100);
}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--pistache-dark); background:var(--white);}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:6px; font-weight:600; font-size:14px; padding:11px 18px; border-radius:9px; border:1.5px solid transparent; cursor:pointer;}
.btn-primary{background:var(--pistache-dark); color:var(--white); width:100%;}
.btn-primary:hover{background:#4d6640;}
.error-msg{background:#FBEAE7; color:#B0463A; font-size:13px; padding:10px 12px; border-radius:8px; margin-bottom:16px;}

/* ---- App shell ---- */
.app{display:flex; min-height:100vh;}
.sidebar{
  width:250px; background:var(--gray-900); color:var(--gray-200); flex-shrink:0;
  display:flex; flex-direction:column; padding:22px 14px; position:sticky; top:0; height:100vh; overflow-y:auto;
}
.sidebar-logo{font-family:var(--font-display); font-weight:700; font-size:17px; color:var(--white); padding:0 10px 20px;}
.sidebar-logo b{color:var(--pistache);}
.side-group{font-family:var(--font-mono); font-size:10.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--gray-400); padding:14px 10px 6px;}
.side-link{display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:8px; font-size:13.5px; color:var(--gray-200);}
.side-link:hover{background:rgba(255,255,255,.06);}
.side-link.active{background:var(--pistache-dark); color:var(--white);}
.side-icon{width:18px; text-align:center;}

.main{flex:1; min-width:0;}
.topbar{
  background:var(--white); border-bottom:1px solid var(--gray-200); padding:16px 28px;
  display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; z-index:10;
}
.topbar h1{font-family:var(--font-display); font-size:19px;}
.topbar .user-chip{display:flex; align-items:center; gap:10px; font-size:13.5px; color:var(--gray-700);}
.avatar{width:32px; height:32px; border-radius:50%; background:var(--pistache-pale); color:var(--pistache-dark); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13px;}
.content{padding:28px;}

/* ---- Cards / stats ---- */
.stat-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:28px;}
.stat-card{background:var(--white); border:1px solid var(--gray-200); border-radius:var(--radius); padding:20px;}
.stat-card .stat-label{font-size:12.5px; color:var(--gray-400); margin-bottom:8px;}
.stat-card .stat-value{font-family:var(--font-display); font-size:26px; color:var(--gray-900);}
.stat-card .stat-value.accent{color:var(--pistache-dark);}

.panel{background:var(--white); border:1px solid var(--gray-200); border-radius:var(--radius); padding:22px; margin-bottom:24px;}
.panel h2{font-family:var(--font-display); font-size:16px; margin-bottom:16px;}

table{width:100%; border-collapse:collapse; font-size:13.5px;}
th{text-align:left; font-size:11.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--gray-400); padding:10px 12px; border-bottom:1px solid var(--gray-200);}
td{padding:12px; border-bottom:1px solid var(--gray-100);}
.badge{display:inline-block; padding:3px 10px; border-radius:100px; font-size:11.5px; font-weight:600;}
.badge-green{background:var(--pistache-pale); color:var(--pistache-dark);}
.badge-blue{background:#DDE7F4; color:#3E6BAE;}
.badge-gray{background:var(--gray-200); color:var(--gray-700);}
.badge-red{background:#FBEAE7; color:#B0463A;}

/* ---- Kanban board (citas) ---- */
.kanban{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
.kanban-col{background:var(--gray-100); border-radius:var(--radius); padding:14px;}
.kanban-col h3{font-size:12.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--gray-700); margin-bottom:12px; font-family:var(--font-mono); font-weight:600;}
.kanban-card{background:var(--white); border:1px solid var(--gray-200); border-radius:10px; padding:12px; margin-bottom:10px; font-size:13px;}
.kanban-card .k-time{font-family:var(--font-mono); font-size:11px; color:var(--pistache-dark); font-weight:600;}
.kanban-card .k-name{font-weight:600; margin-top:4px;}
.kanban-card .k-service{color:var(--gray-400); font-size:12px;}

@media (max-width:960px){
  .sidebar{display:none;}
  .stat-grid{grid-template-columns:repeat(2,1fr);}
  .kanban{grid-template-columns:repeat(2,1fr);}
}
