/* ============================================================
   PIM X — EIOS | style.css | Global | v4.0
   ============================================================ */

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

/* ── VARIABLES ─────────────────────────────────────────────── */
:root {
    --navy         : #0A1628;
    --navy-mid     : #122040;
    --gold         : #F59E0B;
    --gold-dark    : #C9922A;
    --gold-light   : #FEF3C7;
    --emerald      : #10B981;
    --red          : #EF4444;
    --orange       : #F97316;
    --blue         : #3B82F6;
    --bg-page      : #F8FAFC;
    --bg-white     : #FFFFFF;
    --bg-surface   : #F1F5F9;
    --bg-surface2  : #E8EDF5;
    --text-primary : #0F172A;
    --text-dark    : #1B2A4A;
    --text-muted   : #64748B;
    --text-light   : #94A3B8;
    --border       : #E2E8F0;
    --border-md    : #CBD5E1;
    --radius-sm    : 6px;
    --radius-md    : 10px;
    --radius-lg    : 14px;
    --radius-xl    : 20px;
    --shadow-xs    : 0 1px 2px rgba(0,0,0,0.05);
    --shadow-sm    : 0 1px 8px rgba(0,0,0,0.06);
    --shadow-md    : 0 4px 16px rgba(0,0,0,0.08);
    --shadow-lg    : 0 8px 32px rgba(0,0,0,0.10);
    --shadow-gold  : 0 4px 20px rgba(245,158,11,0.25);
    --transition   : all 0.2s ease;
    --font         : 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    --z-sidebar    : 900;
    --z-overlay    : 800;
    --z-navbar     : 1000;
    --z-modal      : 1100;
    --z-toast      : 1200;
}

/* ── RESET ──────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
    font-family: var(--font);
    font-size: 1rem;
    line-height: 1.6;
    color: var(--text-muted);
    background: var(--bg-page);
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
::selection { background: var(--gold-light); color: var(--navy); }
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--bg-surface); }
::-webkit-scrollbar-thumb { background: var(--border-md); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--gold); }
a { color: var(--gold-dark); text-decoration: none; transition: var(--transition); }
a:hover { color: var(--gold); }
img { max-width: 100%; height: auto; display: block; }
ul, ol { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: var(--font); font-size: inherit; }
input, textarea, select { font-family: var(--font); font-size: inherit; outline: none; }
table { border-collapse: collapse; width: 100%; }
h1,h2,h3,h4,h5,h6 { font-weight: 600; line-height: 1.3; color: var(--text-primary); }
h1 { font-size: clamp(1.75rem,4vw,3rem); font-weight: 700; }
h2 { font-size: clamp(1.4rem,3vw,2.25rem); }
h3 { font-size: clamp(1.1rem,2vw,1.5rem); color: var(--text-dark); }
h4 { font-size: 1.125rem; color: var(--text-dark); }
p  { color: var(--text-muted); line-height: 1.7; }

/* ── LAYOUT ─────────────────────────────────────────────────── */
.container    { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 1.5rem; }
.container-sm { max-width: 800px;  margin: 0 auto; padding: 0 1.5rem; }
.flex         { display: flex; }
.flex-col     { display: flex; flex-direction: column; }
.flex-center  { display: flex; align-items: center; justify-content: center; }
.flex-between { display: flex; align-items: center; justify-content: space-between; }
.flex-wrap    { flex-wrap: wrap; }
.items-center { align-items: center; }
.flex-1       { flex: 1; }
.gap-2 { gap: 0.5rem; } .gap-3 { gap: 0.75rem; } .gap-4 { gap: 1rem; }
.gap-5 { gap: 1.25rem; } .gap-6 { gap: 1.5rem; } .gap-8 { gap: 2rem; }
.grid-2 { display: grid; grid-template-columns: repeat(2,1fr); gap: 1.5rem; }
.grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem; }
.grid-4 { display: grid; grid-template-columns: repeat(4,1fr); gap: 1.5rem; }
.col-full { grid-column: 1/-1; }
.mt-2{margin-top:.5rem} .mt-4{margin-top:1rem} .mt-6{margin-top:1.5rem} .mt-8{margin-top:2rem}
.mb-2{margin-bottom:.5rem} .mb-4{margin-bottom:1rem} .mb-6{margin-bottom:1.5rem}
.w-full{width:100%} .d-none{display:none} .relative{position:relative}
.text-center{text-align:center} .text-right{text-align:right}
.text-primary{color:var(--text-primary)!important} .text-dark{color:var(--text-dark)!important}
.text-muted{color:var(--text-muted)!important} .text-light{color:var(--text-light)!important}
.text-gold{color:var(--gold)!important} .text-navy{color:var(--navy)!important}
.text-white{color:#fff!important} .text-red{color:var(--red)!important}
.text-emerald{color:var(--emerald)!important}
.text-sm{font-size:.8125rem} .text-xs{font-size:.75rem} .text-lg{font-size:1.125rem}
.font-500{font-weight:500} .font-600{font-weight:600} .font-700{font-weight:700}
.label-text { font-size:11px; font-weight:500; text-transform:uppercase; letter-spacing:.08em; color:var(--text-light); }
.overflow-hidden{overflow:hidden} .overflow-x-auto{overflow-x:auto}

/* ── BUTTONS ────────────────────────────────────────────────── */
.btn {
    display:inline-flex; align-items:center; justify-content:center;
    gap:.5rem; padding:.625rem 1.25rem; font-size:.9rem; font-weight:500;
    border-radius:var(--radius-md); border:1.5px solid transparent;
    cursor:pointer; transition:var(--transition); white-space:nowrap;
    text-decoration:none; line-height:1;
}
.btn:disabled { opacity:.55; cursor:not-allowed; pointer-events:none; }

.btn-primary {
    background:var(--gold); color:var(--navy);
    border-color:var(--gold); font-weight:600; position:relative; overflow:hidden;
}
.btn-primary::before {
    content:''; position:absolute; inset:0;
    background:linear-gradient(135deg,rgba(255,255,255,.15) 0%,rgba(255,255,255,.05) 100%);
    pointer-events:none;
}
.btn-primary:hover:not(:disabled) {
    background:var(--gold-dark); border-color:var(--gold-dark);
    color:#fff; transform:translateY(-1px); box-shadow:var(--shadow-gold);
}
.btn-secondary {
    background:transparent; color:var(--navy); border-color:var(--navy); font-weight:500;
}
.btn-secondary:hover:not(:disabled) { background:var(--navy); color:#fff; }
.btn-ghost {
    background:transparent; color:var(--text-muted); border-color:var(--border);
}
.btn-ghost:hover:not(:disabled) { background:var(--bg-surface); color:var(--text-dark); border-color:var(--border-md); }
.btn-danger { background:transparent; color:var(--red); border-color:rgba(239,68,68,.3); }
.btn-danger:hover:not(:disabled) { background:var(--red); color:#fff; border-color:var(--red); }
.btn-sm { padding:.375rem .75rem; font-size:.8rem; border-radius:var(--radius-sm); }
.btn-lg { padding:.875rem 2rem; font-size:1rem; font-weight:600; border-radius:var(--radius-lg); }
.btn-block { width:100%; justify-content:center; }
.btn-edit { background:rgba(245,158,11,.08); color:var(--gold-dark); border-color:rgba(245,158,11,.2); }
.btn-edit:hover { background:var(--gold); color:var(--navy); border-color:var(--gold); }
.btn-detail { background:var(--bg-surface); color:var(--text-dark); border-color:var(--border); }
.btn-detail:hover { background:var(--navy); color:#fff; border-color:var(--navy); }
.btn-logout { background:transparent; color:var(--red); border-color:rgba(239,68,68,.2); font-size:.85rem; padding:.5rem 1rem; }
.btn-logout:hover { background:var(--red); color:#fff; border-color:var(--red); }

/* ── FORMS ──────────────────────────────────────────────────── */
.form-group { display:flex; flex-direction:column; gap:.375rem; }
.form-label { font-size:13px; font-weight:500; color:var(--text-dark); }
.form-required { color:var(--red); margin-left:2px; }
.form-optional { color:var(--text-light); font-size:.75rem; font-weight:400; margin-left:4px; }
.form-hint { font-size:.75rem; color:var(--text-light); margin-top:.2rem; line-height:1.5; }
.form-input {
    width:100%; padding:10px 14px;
    background:var(--bg-white); color:var(--text-primary);
    border:1px solid var(--border); border-radius:var(--radius-md);
    font-size:.9rem; font-family:var(--font);
    transition:var(--transition); -webkit-appearance:none; appearance:none;
}
.form-input::placeholder { color:var(--text-light); }
.form-input:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(245,158,11,.10); background:var(--bg-white); outline:none; }
.form-input:disabled { background:var(--bg-surface); color:var(--text-light); cursor:not-allowed; }
.form-input.is-error { border-color:var(--red); box-shadow:0 0 0 3px rgba(239,68,68,.08); }
.form-textarea { resize:vertical; min-height:100px; line-height:1.6; }
select.form-input {
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2364748B' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat:no-repeat; background-position:right 12px center; padding-right:36px;
}
.form-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.25rem; }
.form-group-full { grid-column:1/-1; }
.form-card { background:var(--bg-white); border-radius:var(--radius-lg); padding:2rem; border:1px solid var(--border); box-shadow:var(--shadow-sm); }
.form-section { padding-top:1.5rem; margin-top:1.5rem; border-top:1px solid var(--border); }
.form-section-title { font-size:.9rem; font-weight:600; color:var(--text-dark); margin-bottom:1rem; }
.form-actions { display:flex; gap:.75rem; margin-top:2rem; padding-top:1.5rem; border-top:1px solid var(--border); flex-wrap:wrap; }
.form-info { padding:.75rem 1rem; background:var(--bg-surface); border-radius:var(--radius-sm); font-size:.8rem; color:var(--text-muted); margin-bottom:1.25rem; border-left:3px solid var(--gold); }
.form-checkbox-label { display:flex; align-items:center; gap:.5rem; cursor:pointer; font-size:.9rem; color:var(--text-dark); }
.form-checkbox-label input[type="checkbox"] { width:16px; height:16px; cursor:pointer; accent-color:var(--gold); }
.input-wrapper { position:relative; display:flex; align-items:center; }
.input-wrapper .form-input { flex:1; }
.input-prefix { position:absolute; left:14px; color:var(--text-muted); font-size:.875rem; pointer-events:none; }
.input-with-prefix { padding-left:2.5rem; }
.input-suffix { position:absolute; right:14px; color:var(--text-muted); font-size:.875rem; pointer-events:none; }
.input-toggle-password { position:absolute; right:12px; background:none; border:none; cursor:pointer; color:var(--text-light); padding:.25rem; transition:var(--transition); line-height:1; }
.input-toggle-password:hover { color:var(--gold); }

/* ── ALERTS ─────────────────────────────────────────────────── */
.alert { display:flex; align-items:flex-start; gap:.75rem; padding:.875rem 1rem; border-radius:var(--radius-md); font-size:.875rem; margin-bottom:1.25rem; border:1px solid transparent; line-height:1.5; }
.alert ul { list-style:disc; padding-left:1.25rem; margin-top:.25rem; }
.alert ul li { margin-bottom:.2rem; }
.alert-error   { background:#FEF2F2; border-color:rgba(239,68,68,.25);  color:#991B1B; }
.alert-success { background:#F0FDF4; border-color:rgba(16,185,129,.25);  color:#065F46; }
.alert-warning { background:#FFFBEB; border-color:rgba(245,158,11,.35);  color:#92400E; }
.alert-info    { background:#EFF6FF; border-color:rgba(59,130,246,.25);  color:#1E40AF; }
.alert-icon { font-size:1rem; flex-shrink:0; margin-top:1px; }

/* ── BADGES ─────────────────────────────────────────────────── */
.badge { display:inline-flex; align-items:center; padding:.2rem .625rem; border-radius:var(--radius-sm); font-size:.75rem; font-weight:600; line-height:1; white-space:nowrap; }
.badge-go          { background:#D1FAE5; color:#065F46; }
.badge-conditional { background:#FEF3C7; color:#92400E; }
.badge-nogo        { background:#FEE2E2; color:#991B1B; }
.status-badge { display:inline-flex; align-items:center; padding:.2rem .625rem; border-radius:var(--radius-sm); font-size:.72rem; font-weight:600; line-height:1; }
.status-active     { background:#DBEAFE; color:#1E40AF; }
.status-pipeline   { background:#FEF3C7; color:#92400E; }
.status-completed  { background:#D1FAE5; color:#065F46; }
.status-onhold     { background:#F1F5F9; color:#475569; }
.status-inactive   { background:#F1F5F9; color:#64748B; }
.status-not_started{ background:#F1F5F9; color:#64748B; }
.status-in_progress{ background:#FEF3C7; color:#92400E; }
.status-delayed    { background:#FEE2E2; color:#991B1B; }
.status-prospect   { background:#F1F5F9; color:#64748B; }
.status-negotiation{ background:#EFF6FF; color:#1E40AF; }
.status-mou        { background:#FEF3C7; color:#92400E; }
.status-contracted { background:#D1FAE5; color:#065F46; }
.status-task-pending    { background:#F1F5F9; color:#64748B; }
.status-task-in_progress{ background:#FEF3C7; color:#92400E; }
.status-task-completed  { background:#D1FAE5; color:#065F46; }
.status-task-cancelled  { background:#F1F5F9; color:#94A3B8; }
.risk-low     { background:#D1FAE5; color:#065F46; }
.risk-medium  { background:#FEF3C7; color:#92400E; }
.risk-high    { background:#FEE2E2; color:#991B1B; }
.risk-critical{ background:#FEE2E2; color:#7F1D1D; font-weight:700; }
.role-badge { display:inline-flex; padding:.15rem .5rem; background:var(--bg-surface2); color:var(--text-dark); border-radius:var(--radius-sm); font-size:.7rem; font-weight:700; letter-spacing:.06em; }
.venture-code { display:inline-flex; padding:.15rem .5rem; background:var(--bg-surface); color:var(--navy); border-radius:var(--radius-sm); font-size:.72rem; font-weight:700; letter-spacing:.06em; font-family:monospace; }
.action-badge  { display:inline-flex; padding:.15rem .5rem; border-radius:var(--radius-sm); font-size:.7rem; font-weight:600; }
.action-login  { background:#D1FAE5; color:#065F46; }
.action-logout { background:#F1F5F9; color:#64748B; }
.action-create { background:#DBEAFE; color:#1E40AF; }
.action-update { background:#FEF3C7; color:#92400E; }
.action-delete { background:#FEE2E2; color:#991B1B; }
.action-view   { background:#F1F5F9; color:#64748B; }
.badge-readonly{ display:inline-flex; align-items:center; gap:.25rem; padding:.2rem .625rem; background:#F1F5F9; color:#64748B; border-radius:var(--radius-sm); font-size:.72rem; font-weight:500; }
.badge-overdue { display:inline-flex; padding:.1rem .4rem; background:var(--red); color:#fff; border-radius:4px; font-size:.65rem; font-weight:700; }
.badge-delayed { display:inline-flex; align-items:center; gap:.25rem; padding:.2rem .5rem; background:#FEE2E2; color:#991B1B; border-radius:var(--radius-sm); font-size:.72rem; font-weight:600; }
.badge-income  { background:#D1FAE5; color:#065F46; padding:.15rem .5rem; border-radius:4px; font-size:.72rem; font-weight:600; display:inline-flex; }
.badge-expense { background:#FEE2E2; color:#991B1B; padding:.15rem .5rem; border-radius:4px; font-size:.72rem; font-weight:600; display:inline-flex; }
.badge-transfer{ background:#EFF6FF; color:#1E40AF; padding:.15rem .5rem; border-radius:4px; font-size:.72rem; font-weight:600; display:inline-flex; }
.division-badge{ display:inline-flex; padding:.2rem .5rem; background:#FEF3C7; color:#92400E; border-radius:var(--radius-sm); font-size:.72rem; font-weight:600; }
.assignee-badge{ display:inline-flex; padding:.2rem .5rem; background:var(--bg-surface); color:var(--text-dark); border-radius:var(--radius-sm); font-size:.8rem; font-weight:500; }

/* ── PROGRESS BAR ───────────────────────────────────────────── */
.progress-bar-wrap { width:100%; height:6px; background:var(--bg-surface); border-radius:3px; overflow:hidden; }
.progress-bar { height:100%; background:linear-gradient(90deg,var(--gold-dark),var(--gold)); border-radius:3px; transition:width .5s ease; min-width:2px; }
.progress-bar-sm  { height:4px; }
.progress-bar-lg  { height:10px; }
.progress-bar-blue   { background:linear-gradient(90deg,#2563EB,#3B82F6); }
.progress-bar-emerald{ background:linear-gradient(90deg,#059669,#10B981); }
.progress-bar-red    { background:linear-gradient(90deg,#DC2626,#EF4444); }
.progress-pct { font-size:.78rem; font-weight:600; color:var(--text-dark); margin-top:.25rem; display:block; }

/* ── DATA TABLE ─────────────────────────────────────────────── */
.table-responsive { overflow-x:auto; border-radius:var(--radius-lg); border:1px solid var(--border); }
.data-table { width:100%; border-collapse:collapse; font-size:14px; }
.data-table thead th { padding:.75rem 1rem; background:var(--bg-surface); color:var(--text-light); font-size:11px; font-weight:500; text-transform:uppercase; letter-spacing:.06em; text-align:left; white-space:nowrap; border-bottom:1px solid var(--border); }
.data-table tbody tr { border-bottom:1px solid var(--bg-surface); transition:background var(--transition); }
.data-table tbody tr:last-child { border-bottom:none; }
.data-table tbody tr:hover { background:#FFFBEB; }
.data-table tbody td { padding:.875rem 1rem; color:var(--text-primary); vertical-align:middle; font-size:14px; }
.data-table tfoot td { padding:.875rem 1rem; background:var(--bg-surface); font-size:13px; border-top:2px solid var(--border); font-weight:600; color:var(--text-dark); }
.row-danger { background:#FEF2F2!important; }
.row-muted  { opacity:.55; }
.table-division-row td { background:var(--bg-surface); font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.08em; color:var(--text-light); padding:.5rem 1rem; }

/* ── FILTER ─────────────────────────────────────────────────── */
.filter-form { background:var(--bg-white); border-radius:var(--radius-md); padding:1.25rem; border:1px solid var(--border); box-shadow:var(--shadow-xs); margin-bottom:1.25rem; }
.filter-grid { display:flex; flex-wrap:wrap; gap:.75rem; align-items:flex-end; }
.filter-item { flex:1; min-width:140px; }
.filter-search { flex:2; min-width:200px; }
.filter-actions { display:flex; gap:.5rem; flex:0; min-width:auto; }

/* ── EMPTY STATE ────────────────────────────────────────────── */
.empty-state { text-align:center; padding:3.5rem 2rem; }
.empty-icon  { font-size:2.5rem; margin-bottom:.875rem; }
.empty-title { font-size:1rem; font-weight:600; color:var(--text-dark); margin-bottom:.4rem; }
.empty-desc  { font-size:.875rem; color:var(--text-muted); margin-bottom:1.5rem; }

/* ── MISC ───────────────────────────────────────────────────── */
.section-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.25rem; flex-wrap:wrap; gap:.75rem; }
.section-title  { font-size:1rem; font-weight:600; color:var(--text-dark); }
.section-link   { font-size:.8rem; color:var(--gold-dark); font-weight:500; }
.section-link:hover { color:var(--gold); }
.breadcrumb-link { color:var(--text-muted); font-size:.875rem; }
.breadcrumb-link:hover { color:var(--gold); }
.notes-card { background:var(--bg-surface); border-left:3px solid var(--gold); border-radius:0 var(--radius-md) var(--radius-md) 0; padding:1rem 1.25rem; font-size:.875rem; line-height:1.7; color:var(--text-dark); }
.skip-to-content { position:absolute; top:-100%; left:1rem; padding:.5rem 1rem; background:var(--gold); color:var(--navy); font-weight:600; border-radius:var(--radius-sm); z-index:var(--z-toast); transition:top .2s; font-size:.875rem; }
.skip-to-content:focus { top:1rem; }
.divider { height:1px; background:var(--border); margin:1.5rem 0; }
.coming-soon-card { text-align:center; padding:3rem 2rem; background:var(--bg-white); border-radius:var(--radius-lg); border:2px dashed var(--border); }
.coming-soon-icon  { font-size:2rem; margin-bottom:.75rem; }
.coming-soon-title { font-size:1rem; font-weight:600; color:var(--text-muted); }
.link-meeting { color:var(--text-dark); font-weight:500; }
.link-meeting:hover { color:var(--gold); }

/* ── RESPONSIVE ─────────────────────────────────────────────── */
@media (max-width:1024px) {
    .grid-4 { grid-template-columns:repeat(2,1fr); }
    .hide-tablet { display:none!important; }
}
@media (max-width:768px) {
    html { font-size:15px; }
    .container,.container-sm { padding:0 1rem; }
    .grid-2,.grid-3,.grid-4 { grid-template-columns:1fr; }
    .form-grid { grid-template-columns:1fr; }
    .form-group-full { grid-column:1; }
    .filter-grid { flex-direction:column; }
    .filter-item,.filter-search { width:100%; flex:none; }
    .filter-actions { width:100%; }
    .form-actions { flex-direction:column; }
    .form-actions .btn { width:100%; justify-content:center; }
    .data-table { font-size:13px; }
    .data-table thead th,.data-table tbody td { padding:.625rem .75rem; }
    .section-header { flex-direction:column; align-items:flex-start; }
    .hide-mobile { display:none!important; }
}
@media (max-width:480px) {
    html { font-size:14px; }
    .form-card { padding:1.25rem; }
    .btn-lg { padding:.75rem 1.5rem; font-size:.9rem; }
}