:root{
  --color-bg:#f3f2f2;
  --color-text:#201e1d;
  --color-accent:#0088b0;
  --color-accent-600:#00708f;
  --color-accent-100:#dcedf1;
  --color-accent-2:#d6006c;
  --color-accent-2-100:#f8dcea;
  --color-neutral-200:#e3e1e0;
  --color-neutral-500:#8a8785;
  --font-body:Calibri, 'Segoe UI', Arial, sans-serif;
  --font-heading:Arial, Helvetica, sans-serif;
  --space-2:8px; --space-3:12px; --space-4:16px; --space-6:24px; --space-8:32px;
  --radius:2px;
}
*{box-sizing:border-box;}
body{margin:0;background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);font-size:15px;line-height:1.5;}
a{color:var(--color-accent-600);text-decoration:none;}
a:hover{color:var(--color-accent-2);text-decoration:underline;}
h1,h2,h3{font-family:var(--font-heading);font-weight:600;margin:0 0 var(--space-3);}
h1{font-size:32px;} h2{font-size:20px;}

/* Layout */
.sidebar{position:fixed;top:0;left:0;bottom:0;width:230px;background:#fff;border-right:1px solid var(--color-neutral-200);padding:var(--space-6) var(--space-4);display:flex;flex-direction:column;z-index:10;}
.sidebar .brand{font-size:19px;font-weight:700;margin-bottom:2px;font-family:var(--font-heading);}
.sidebar .despacho-name{font-size:12px;opacity:.6;margin-bottom:var(--space-6);}
.sidebar nav{display:flex;flex-direction:column;gap:2px;flex:1;}
.sidebar nav a{color:var(--color-text);padding:var(--space-2) var(--space-3);border-radius:var(--radius);font-size:14px;display:flex;align-items:center;gap:10px;}
.sidebar nav a:hover,.sidebar nav a.active{background:var(--color-accent-100);color:var(--color-accent-600);text-decoration:none;}
.sidebar nav a i{width:16px;text-align:center;color:var(--color-accent);}
.sidebar-user{border-top:1px solid var(--color-neutral-200);padding-top:var(--space-3);font-size:13px;}
.sidebar-user-name{font-weight:600;}
.sidebar-user-role{opacity:.6;text-transform:capitalize;margin-bottom:var(--space-2);}
.sidebar-user .logout{color:var(--color-accent-2);font-size:13px;}
.sidebar-toggle{display:none;position:fixed;top:12px;left:12px;z-index:20;background:#fff;border:1px solid var(--color-neutral-200);border-radius:var(--radius);width:38px;height:38px;}
.main-content{margin-left:230px;padding:var(--space-8) var(--space-6);max-width:1280px;}
.main-content.full{margin-left:0;max-width:480px;margin:0 auto;padding-top:80px;}
@media (max-width:900px){
  .sidebar{transform:translateX(-100%);transition:.2s;}
  .sidebar.open{transform:translateX(0);}
  .sidebar-toggle{display:block;}
  .main-content{margin-left:0;padding-top:60px;}
}

/* Alerts */
.alert{padding:var(--space-3) var(--space-4);border-radius:var(--radius);margin-bottom:var(--space-4);font-size:14px;}
.alert-success{background:var(--color-accent-100);color:var(--color-accent-600);}
.alert-danger{background:var(--color-accent-2-100);color:var(--color-accent-2);}

/* Cards */
.card{background:#fff;border:1px solid var(--color-neutral-200);border-radius:var(--radius);padding:var(--space-4);}
.card-kicker{font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.55;margin-bottom:4px;}
.card-title{font-family:var(--font-heading);font-size:18px;font-weight:600;}
.card-body{font-size:13px;opacity:.7;margin:4px 0 0;}
.grid{display:grid;gap:var(--space-4);}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr));}
@media (max-width:700px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}}

/* Table */
table.table{width:100%;border-collapse:collapse;font-size:14px;background:#fff;}
table.table th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.06em;opacity:.55;padding:var(--space-3);border-bottom:1px solid var(--color-neutral-200);}
table.table td{padding:var(--space-3);border-bottom:1px solid var(--color-neutral-200);}
table.table tr:hover td{background:var(--color-accent-100);}
.folder-card{background:#fff;border:1px solid var(--color-neutral-200);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;height:100%;transition:box-shadow .15s, transform .15s;}
.folder-card,.folder-card *{text-decoration:none !important;}
.folder-card:hover{box-shadow:0 4px 14px rgba(0,0,0,.1);transform:translateY(-1px);}
.folder-card .folder-tab{padding:10px var(--space-4);color:#fff;font-size:11px;letter-spacing:.08em;text-transform:uppercase;display:flex;justify-content:space-between;gap:8px;}
.folder-card .folder-apellidos{padding:var(--space-3) var(--space-4) 2px;font-family:var(--font-heading);font-size:21px;font-weight:700;color:var(--color-text);line-height:1.2;border-bottom:2px solid var(--color-accent-2);margin:0 var(--space-4);padding-left:0;padding-right:0;}
.folder-card .folder-body{padding:var(--space-3) var(--space-4) var(--space-4);flex:1;display:flex;flex-direction:column;}
.folder-card .folder-row{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-3);font-size:13px;padding:6px 0;border-bottom:1px dotted var(--color-neutral-200);}
.folder-card .folder-row:last-child{border-bottom:none;}
.folder-card .folder-row span:first-child{opacity:.5;text-transform:uppercase;font-size:10.5px;letter-spacing:.05em;flex-shrink:0;}
.folder-card .folder-row span:last-child{font-weight:600;color:var(--color-text);text-align:right;}
.folder-card .folder-footer{display:flex;justify-content:space-between;align-items:center;margin-top:var(--space-3);padding-top:var(--space-3);border-top:1px solid var(--color-neutral-200);}
.folder-materia-civil{background:#4a7c59;}
.folder-materia-penal{background:#8a3b3b;}
.folder-materia-laboral{background:#8a6d1f;}
.folder-materia-familia{background:#5a4a8a;}
.folder-materia-administrativo{background:#2f6b7a;}
.folder-materia-default{background:var(--color-neutral-500);}

/* Tags */
.tag{display:inline-block;padding:3px 10px;border-radius:12px;font-size:12px;}
.tag-accent{background:var(--color-accent-100);color:var(--color-accent-600);}
.tag-accent-2{background:var(--color-accent-2-100);color:var(--color-accent-2);}
.tag-neutral{background:var(--color-neutral-200);color:var(--color-text);}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-body);font-size:14px;padding:9px 18px;border-radius:var(--radius);border:1px solid transparent;cursor:pointer;}
.btn-primary{background:var(--color-accent);color:#fff;}
.btn-primary:hover{background:var(--color-accent-600);}
.btn-secondary{background:#fff;border-color:var(--color-neutral-200);color:var(--color-text);}
.btn-secondary:hover{background:var(--color-neutral-200);}
.btn-ghost{background:transparent;color:var(--color-accent-600);}
.btn-danger{background:transparent;color:var(--color-accent-2);}
.btn-sm{padding:5px 12px;font-size:13px;}
.btn-sm.btn-secondary{background:#fff;}
a.btn{text-decoration:none;}

/* Forms */
.field{margin-bottom:var(--space-4);}
.field label{display:block;font-size:13px;font-weight:600;margin-bottom:4px;}
.input,select.input,textarea.input{width:100%;padding:9px 12px;border:1px solid var(--color-neutral-200);border-radius:var(--radius);font-family:var(--font-body);font-size:14px;background:#fff;color:var(--color-text);}
.input:focus{outline:2px solid var(--color-accent);outline-offset:1px;}
.form-actions{display:flex;gap:var(--space-3);margin-top:var(--space-6);}
.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-6);flex-wrap:wrap;gap:var(--space-3);}
.bar-track{height:8px;background:var(--color-neutral-200);border-radius:6px;overflow:hidden;}
.bar-fill{height:100%;background:var(--color-accent);}
.bar-fill.accent2{background:var(--color-accent-2);}

/* Login */
.login-card{background:#fff;border:1px solid var(--color-neutral-200);border-radius:var(--radius);padding:var(--space-8);}
.login-card h1{text-align:center;font-size:26px;}
.login-sub{text-align:center;opacity:.6;font-size:13px;margin-bottom:var(--space-6);}