.card{background:var(--panel); border-radius:var(--radius); box-shadow:var(--shadow); padding:14px; transition:transform .15s}
.card:hover{transform:translateY(-2px)}

.table-card{background:var(--panel); border-radius:var(--radius); box-shadow:var(--shadow); margin-top:16px; overflow:hidden}
.table-card > .section-header{padding:18px 20px 0}
.responsive-scroll{overflow:auto}

.section-header{display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:16px}
.section-header .actions{display:flex; gap:8px; flex-wrap:wrap}

.stats-row{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px; margin:20px 0}
.stat-card{background:var(--panel); border-radius:var(--radius); border-left:4px solid var(--accent); padding:14px; box-shadow:var(--shadow); display:flex; flex-direction:column; gap:6px}
.stat-card span{font-size:1.4rem; font-weight:700; color:var(--text)}

.grid-two{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:18px}
.form-base{background:var(--panel); border-radius:var(--radius); box-shadow:var(--shadow); padding:18px; display:flex; flex-direction:column; gap:12px}
.form-group{display:flex; flex-direction:column; gap:6px}
.full-height{min-height:100%}

.btn-inline{background:none; border:none; color:var(--accent); cursor:pointer; font-size:1rem; padding:0}
.btn-inline:hover{opacity:.75}
.table-actions{display:flex; align-items:center; gap:6px}

.btn{border:1px solid transparent; border-radius:var(--radius); padding:8px 12px; cursor:pointer; font-size:var(--size); display:inline-flex; align-items:center; justify-content:center; gap:6px}
.btn-primary{background:var(--accent); color:#fff}
.btn-primary:hover{opacity:.9}
.btn-secondary{background:transparent; color:var(--accent); border-color:var(--accent)}
.btn-secondary:hover{background:var(--accent); color:#fff}
.btn-ghost{background:transparent; color:var(--text); border-color:var(--border)}
.btn-ghost:hover{background:var(--bg)}

.input{
  width:100%;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:7px 10px;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font);
}
.input:focus{outline:none; border-color:var(--accent)}
.input[type="file"]{padding:6px 8px; background:var(--panel);}
textarea.input{resize:vertical; min-height:88px; line-height:1.4;}
.form{background:var(--panel); border-radius:var(--radius); box-shadow:var(--shadow); padding:16px; margin-top:16px; display:flex; flex-direction:column; gap:8px}
.form-actions{display:flex; gap:8px}

.alert{padding:10px 12px; border-radius:var(--radius); margin:10px 0; font-weight:500}
.alert-success{background:var(--success-bg); color:var(--success-fg)}
.alert-warning{background:var(--warn-bg); color:var(--warn-fg)}
.alert-error{background:var(--error-bg); color:var(--error-fg)}

.badge.pendiente{background:var(--warn-bg); color:var(--warn-fg)}
.badge.aprobado{background:var(--success-bg); color:var(--success-fg)}
.badge.rechazado{background:var(--error-bg); color:var(--error-fg)}

.table-toolbar{display:flex; align-items:center; justify-content:space-between; margin-bottom:8px}
.table-wrap{overflow:auto; border:1px solid var(--border); border-radius:var(--radius)}
.table{width:100%; border-collapse:collapse}
.table th,.table td{padding:10px; border-bottom:1px solid var(--border)}
.table th{color:var(--muted); background:var(--bg); text-align:left}
.table tbody tr:hover{background:rgba(0,0,0,.04)}

.badge{padding:2px 6px; border-radius:999px; font-weight:600}
.badge-success{background:var(--success-bg); color:var(--success-fg)}
.badge-warning{background:var(--warn-bg); color:var(--warn-fg)}

.dropdown{position:relative}
.dropdown-menu{display:none; position:absolute; top:calc(100% + 6px); left:0; background:var(--panel); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); padding:6px; min-width:180px; z-index:8}
.dropdown.open .dropdown-menu{display:block}
.dropdown-menu button{width:100%; border:none; background:none; padding:8px; text-align:left; cursor:pointer; border-radius:6px; color:var(--text)}
.dropdown-menu button:hover{background:var(--bg)}