@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;600;700;800&family=Barlow:wght@300;400;500;600&display=swap');

:root {
    --red:      #E8320A;
    --red-dk:   #C42800;
    --red-lt:   #FFF0ED;
    --dark:     #1E1E1E;
    --text:     #2C2C2C;
    --text-mid: #555;
    --muted:    #999;
    --border:   #E4DED8;
    --bg:       #F5F2EF;
    --white:    #FFFFFF;
    --sw:       250px;
    --th:       62px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Barlow',sans-serif;background:var(--bg);color:var(--text);display:flex;min-height:100vh;font-size:14px}
a{color:var(--red);text-decoration:none}
a:hover{color:var(--red-dk)}

/* ── SIDEBAR ── */
.phi-sidebar{width:var(--sw);background:var(--white);min-height:100vh;position:fixed;top:0;left:0;display:flex;flex-direction:column;z-index:100;border-right:1px solid var(--border);box-shadow:2px 0 12px rgba(0,0,0,.06)}
.phi-logo-wrap{display:flex;align-items:center;gap:12px;padding:20px 18px 18px;border-bottom:2px solid var(--red-lt)}
.phi-logo{width:46px;height:46px;border-radius:10px;object-fit:cover;flex-shrink:0;box-shadow:0 2px 10px rgba(232,50,10,.25)}
.phi-logo-name{font-family:'Barlow Condensed',sans-serif;font-size:20px;font-weight:800;color:var(--dark);line-height:1}
.phi-logo-sub{font-size:9px;color:var(--red);letter-spacing:2px;text-transform:uppercase;margin-top:3px}
.phi-nav{flex:1;padding:10px 0;overflow-y:auto}
.phi-nav-label{font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#CCC;padding:10px 20px 4px}
.phi-nav a{display:flex;align-items:center;gap:10px;padding:10px 20px;color:var(--text-mid);font-size:13px;font-weight:500;transition:all .12s;border-left:3px solid transparent}
.phi-nav a svg{width:17px;height:17px;fill:currentColor;flex-shrink:0;opacity:.6}
.phi-nav a:hover{color:var(--red);background:var(--red-lt);border-left-color:rgba(232,50,10,.3)}
.phi-nav a.active{color:var(--red);background:var(--red-lt);border-left-color:var(--red);font-weight:600}
.phi-nav a.active svg{opacity:1}
.phi-sidebar-footer{padding:12px 16px;border-top:1px solid var(--border);background:#FAFAFA;display:flex;align-items:center;justify-content:space-between}
.phi-user-info{display:flex;align-items:center;gap:10px;min-width:0}
.phi-user-avatar{width:34px;height:34px;border-radius:8px;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:15px;flex-shrink:0}
.phi-user-name{font-size:12px;font-weight:600;color:var(--dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}
.phi-user-role{font-size:10px;color:var(--muted);text-transform:capitalize}
.phi-logout{color:#DDD;display:flex;align-items:center;transition:color .12s;flex-shrink:0}
.phi-logout svg{width:18px;height:18px;fill:currentColor}
.phi-logout:hover{color:var(--red)}

/* ── MAIN ── */
.phi-main{margin-left:var(--sw);flex:1;display:flex;flex-direction:column;min-height:100vh}
.phi-topbar{height:var(--th);background:var(--white);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;z-index:50;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.phi-page-title{font-family:'Barlow Condensed',sans-serif;font-size:22px;font-weight:800;color:var(--dark);display:flex;align-items:center;gap:10px}
.phi-page-title::before{content:'';display:inline-block;width:4px;height:22px;background:var(--red);border-radius:2px}
.phi-topbar-right{display:flex;align-items:center;gap:16px}
.phi-date{font-size:12px;color:var(--muted);background:#F5F2EF;padding:4px 10px;border-radius:20px;border:1px solid var(--border)}
.phi-content{padding:28px;flex:1}

/* ── CARDS ── */
.phi-card{background:var(--white);border-radius:8px;border:1px solid var(--border);margin-bottom:22px;overflow:hidden;box-shadow:0 1px 6px rgba(0,0,0,.05)}
.phi-card-header{background:#F9F6F3;border-bottom:1px solid var(--border);padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.phi-card-header h2{font-family:'Barlow Condensed',sans-serif;font-size:13px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--dark)}
.phi-card-body{padding:22px}
.phi-card-body.no-pad{padding:0}

/* ── STATS ── */
.phi-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;margin-bottom:24px}
.phi-stat{background:var(--white);padding:22px 20px;border-radius:8px;border:1px solid var(--border);border-top:4px solid var(--red);text-align:center;box-shadow:0 1px 6px rgba(0,0,0,.05)}
.phi-stat-num{font-family:'Barlow Condensed',sans-serif;font-size:52px;font-weight:800;line-height:1;color:var(--red)}
.phi-stat-label{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-top:5px}

/* ── TABLAS ── */
.phi-table-wrap{overflow-x:auto}
.phi-table{width:100%;border-collapse:collapse;font-size:13px}
.phi-table th{background:#F4F0EC;color:var(--dark);padding:10px 14px;text-align:left;font-family:'Barlow Condensed',sans-serif;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;border-bottom:2px solid var(--border);white-space:nowrap}
.phi-table td{padding:10px 14px;border-bottom:1px solid #F0EBE4;vertical-align:middle;color:var(--text)}
.phi-table tbody tr:last-child td{border-bottom:none}
.phi-table tbody tr:hover td{background:#FFF8F5}

/* ── FORMULARIOS ── */
.phi-form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:16px}
.phi-form-row.cols-1{grid-template-columns:1fr}
.phi-form-row.cols-2{grid-template-columns:1fr 1fr}
.phi-form-row.cols-3{grid-template-columns:1fr 1fr 1fr}
.phi-form-group label{display:block;font-size:10px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin-bottom:5px}
.phi-form-group input[type=text],
.phi-form-group input[type=email],
.phi-form-group input[type=number],
.phi-form-group input[type=password],
.phi-form-group input[type=datetime-local],
.phi-form-group select,
.phi-form-group textarea{width:100%;padding:9px 13px;border:1.5px solid #E0DBD5;border-radius:5px;font-family:'Barlow',sans-serif;font-size:13px;background:#FAFAF9;color:var(--text);transition:all .15s}
.phi-form-group input:focus,
.phi-form-group select:focus,
.phi-form-group textarea:focus{outline:none;border-color:var(--red);background:var(--white);box-shadow:0 0 0 3px rgba(232,50,10,.08)}
.phi-form-group textarea{min-height:80px;resize:vertical}
.phi-form-actions{display:flex;gap:10px;align-items:center;margin-top:8px;flex-wrap:wrap}

/* ── BOTONES ── */
.phi-btn{display:inline-flex;align-items:center;gap:6px;font-family:'Barlow Condensed',sans-serif;font-size:13px;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:9px 20px;border-radius:5px;cursor:pointer;border:none;text-decoration:none;transition:all .12s;white-space:nowrap}
.phi-btn svg{width:15px;height:15px;fill:currentColor;flex-shrink:0}
.phi-btn-primary{background:var(--red);color:#fff;box-shadow:0 2px 6px rgba(232,50,10,.25)}
.phi-btn-primary:hover{background:var(--red-dk);color:#fff;box-shadow:0 3px 10px rgba(232,50,10,.35)}
.phi-btn-dark{background:var(--dark);color:#fff}
.phi-btn-dark:hover{background:#333;color:#fff}
.phi-btn-danger{background:#FEE2E2;color:#991B1B;border:1px solid #FECACA}
.phi-btn-danger:hover{background:#991B1B;color:#fff}
.phi-btn-success{background:#D1FAE5;color:#065F46;border:1px solid #A7F3D0}
.phi-btn-success:hover{background:#065F46;color:#fff}
.phi-btn-outline{background:transparent;border:2px solid var(--red);color:var(--red)}
.phi-btn-outline:hover{background:var(--red);color:#fff}
.phi-btn-ghost{background:transparent;border:1px solid var(--border);color:var(--text-mid)}
.phi-btn-ghost:hover{border-color:var(--red);color:var(--red);background:var(--red-lt)}
.phi-btn-sm{padding:5px 13px;font-size:11px}
.phi-btn-lg{padding:12px 28px;font-size:15px}

/* ── BADGES ── */
.phi-badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:10px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;white-space:nowrap}
.phi-badge-red{background:#FEE2E2;color:#991B1B}
.phi-badge-green{background:#D1FAE5;color:#065F46}
.phi-badge-amber{background:#FEF3C7;color:#92400E}
.phi-badge-blue{background:#DBEAFE;color:#1E40AF}
.phi-badge-gray{background:#F3F4F6;color:#4B5563}
.phi-badge-dark{background:var(--dark);color:#fff}

/* ── FLASH ── */
.phi-flash{display:flex;align-items:center;gap:10px;padding:12px 18px;border-radius:5px;font-size:13px;margin-bottom:18px;border-left:4px solid transparent}
.phi-flash-success{background:#D1FAE5;border-color:#059669;color:#065F46}
.phi-flash-error{background:#FEE2E2;border-color:#DC2626;color:#991B1B}
.phi-flash-info{background:#DBEAFE;border-color:#2563EB;color:#1D4ED8}

/* ── ACTION BAR ── */
.phi-action-bar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:20px}
.phi-action-bar-left,.phi-action-bar-right{display:flex;gap:10px;align-items:center;flex-wrap:wrap}

/* ── LOGIN ── */
.phi-login-body{background:linear-gradient(135deg,#F7F4F1 0%,#EDE8E3 100%);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.phi-login-box{background:var(--white);border:1px solid var(--border);border-radius:14px;width:100%;max-width:400px;overflow:hidden;box-shadow:0 10px 40px rgba(0,0,0,.10)}
.phi-login-header{padding:36px 32px 22px;text-align:center;background:linear-gradient(160deg,#FFF5F3 0%,var(--white) 100%);border-bottom:1px solid var(--border)}
.phi-login-logo{width:96px;height:96px;border-radius:20px;object-fit:cover;margin:0 auto 16px;display:block;box-shadow:0 4px 20px rgba(232,50,10,.3)}
.phi-login-title{font-family:'Barlow Condensed',sans-serif;font-size:30px;font-weight:800;color:var(--dark);letter-spacing:.5px}
.phi-login-sub{font-size:10px;color:var(--red);letter-spacing:3px;text-transform:uppercase;margin-top:5px}
.phi-login-form{padding:24px 32px 30px}
.phi-login-form .phi-form-group label{color:var(--muted)}
.phi-login-form .phi-btn{width:100%;justify-content:center}
.phi-login-footer{padding:14px 32px;background:#FAFAF9;border-top:1px solid var(--border);text-align:center;font-size:11px;color:#CCC;letter-spacing:1px}

/* ── PRINT ── */
.phi-print-header{display:none}
.phi-print-sign{display:none}
@media print{
    .phi-sidebar,.phi-topbar,.phi-action-bar,.phi-flash,.no-print{display:none !important}
    .phi-main{margin-left:0 !important}
    .phi-content{padding:0 !important}
    .phi-card{border:1px solid #ccc !important;box-shadow:none !important}
    .phi-table th{background:#F4F0EC !important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
    body{background:#fff !important}
    .phi-print-header{display:block !important}
    .phi-print-sign{display:block !important}
    .phi-btn{display:none !important}
}
