:root {
  --bg: #f6f7fb;
  --surface: #ffffff;
  --surface-2: #f1f3f9;
  --border: #e5e7eb;
  --text: #0f172a;
  --muted: #6b7280;
  --primary: #4f46e5;
  --primary-fg: #ffffff;
  --danger: #dc2626;
  --warning: #d97706;
  --info: #2563eb;
  --success: #16a34a;
  --radius: 12px;
  --shadow: 0 1px 2px rgba(15,23,42,.06), 0 8px 24px rgba(15,23,42,.05);
}
[data-theme="dark"] {
  --bg: #0b1020;
  --surface: #121a32;
  --surface-2: #182241;
  --border: #25304f;
  --text: #e6e9f2;
  --muted: #94a3b8;
  --primary: #6366f1;
  --shadow: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.3);
}
html, body { background: var(--bg); color: var(--text); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, sans-serif; }

/* App shell */
.ifkh-app { display: grid; grid-template-columns: 280px 1fr; min-height: 100vh; }
.ifkh-sidebar { background: var(--surface); border-right: 1px solid var(--border); display: flex; flex-direction: column; height: 100vh; position: sticky; top: 0; }
.ifkh-sidebar-head { display:flex; justify-content:space-between; align-items:center; padding: 18px 16px; border-bottom: 1px solid var(--border); }
.ifkh-brand { display:flex; align-items:center; gap:10px; color: var(--text); text-decoration:none; font-weight:700; }
.ifkh-logo { width:32px;height:32px;border-radius:8px; background: linear-gradient(135deg,#4f46e5,#7c3aed); color:#fff; display:inline-flex;align-items:center;justify-content:center;font-weight:800; }
.ifkh-sidebar-search { padding: 12px 16px; }
.ifkh-section-label { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); padding: 6px 18px; }
.ifkh-company-list { list-style:none; padding: 4px 8px; margin: 0; overflow-y:auto; flex:1; }
.ifkh-company-item { display:flex; align-items:center; gap:10px; padding: 9px 12px; border-radius: 10px; color: var(--text); text-decoration:none; font-size: 14px; }
.ifkh-company-item:hover { background: var(--surface-2); }
.ifkh-company-item.active { background: var(--primary); color: var(--primary-fg); }
.ifkh-sidebar-foot { padding: 12px 16px; border-top: 1px solid var(--border); }
.ifkh-user-name { font-weight:600; font-size: 14px; }
.ifkh-user-role { font-size: 12px; color: var(--muted); text-transform: uppercase; }
.ifkh-empty { color: var(--muted); padding: 12px; font-size: 13px; }

.ifkh-main { display:flex; flex-direction:column; min-width:0; }
.ifkh-topbar { display:flex; gap: 12px; align-items:center; padding: 12px 20px; background: var(--surface); border-bottom: 1px solid var(--border); }
.ifkh-search-global { flex:1; position: relative; max-width: 520px; }
.ifkh-search-results { position:absolute; top:110%; left:0; right:0; background: var(--surface); border:1px solid var(--border); border-radius: 10px; box-shadow: var(--shadow); padding: 8px; z-index: 50; max-height: 60vh; overflow:auto; }
.ifkh-search-results h6 { font-size: 11px; text-transform: uppercase; color: var(--muted); margin: 8px 6px 4px; }
.ifkh-search-results a { display:block; padding: 6px 8px; border-radius: 6px; color: var(--text); text-decoration:none; font-size: 14px; }
.ifkh-search-results a:hover { background: var(--surface-2); }

.ifkh-content { padding: 24px; }

.ifkh-page-head { display:flex; justify-content: space-between; align-items: center; margin-bottom: 18px; gap: 12px; flex-wrap: wrap; }
.ifkh-page-head h1 { font-size: 22px; margin: 0; font-weight: 700; }

.ifkh-card { background: var(--surface); border:1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; }
.ifkh-card-head { display:flex; justify-content:space-between; align-items:center; padding: 14px 18px; border-bottom: 1px solid var(--border); }
.ifkh-card-head h5 { margin: 0; font-size: 15px; font-weight: 600; }
.ifkh-card .table { margin: 0; }
.ifkh-card .table > :not(caption) > * > * { background: transparent; color: var(--text); }
.ifkh-card form.row { padding: 14px 18px; margin: 0; }

.ifkh-stat-card { background: var(--surface); border:1px solid var(--border); border-radius: var(--radius); padding: 18px; box-shadow: var(--shadow); }
.ifkh-stat-ico { font-size: 22px; }
.ifkh-stat-val { font-size: 28px; font-weight: 800; margin-top: 4px; }
.ifkh-stat-label { color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .06em; }

/* Company page */
.ifkh-company-head { display:flex; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.ifkh-company-head h1 { margin:0; font-size: 22px; }
.ifkh-company-desc { color: var(--muted); margin: 4px 0 0; }
.ifkh-company-grid { display: grid; grid-template-columns: 1fr 320px; gap: 18px; }
.ifkh-center, .ifkh-right { background: var(--surface); border:1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 14px; }
.ifkh-tab-content { padding-top: 14px; }
.ifkh-doc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px,1fr)); gap: 12px; }
.ifkh-doc-card { display:block; padding: 14px; border:1px solid var(--border); border-radius: 10px; background: var(--surface-2); color: var(--text); text-decoration:none; transition: transform .12s ease; }
.ifkh-doc-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.ifkh-doc-ico { font-size: 26px; }
.ifkh-doc-title { font-weight: 600; margin-top: 6px; font-size: 14px; }
.ifkh-doc-meta { color: var(--muted); font-size: 12px; margin-top: 2px; }

/* Notes */
.ifkh-notes-stack { display:flex; flex-direction: column; gap: 10px; }
.ifkh-note { border:1px solid var(--border); border-left-width: 4px; border-radius: 10px; padding: 12px 14px; background: var(--surface-2); }
.ifkh-note-critical { border-left-color: var(--danger); }
.ifkh-note-warning  { border-left-color: var(--warning); }
.ifkh-note-info     { border-left-color: var(--info); }
.ifkh-note header { display:flex; align-items:center; gap: 8px; }
.ifkh-note h5, .ifkh-note h6 { margin: 6px 0 0; }
.ifkh-note-body { font-size: 14px; color: var(--text); }
.ifkh-prio { font-size: 10px; padding: 2px 8px; border-radius: 999px; font-weight: 700; letter-spacing: .06em; color: #fff; }
.ifkh-prio-critical { background: var(--danger); }
.ifkh-prio-warning  { background: var(--warning); }
.ifkh-prio-info     { background: var(--info); }

/* PDF viewer */
.ifkh-pdf-toolbar { display:flex; gap:6px; align-items:center; padding: 10px 12px; background: var(--surface); border:1px solid var(--border); border-radius: var(--radius) var(--radius) 0 0; }
.ifkh-pdf-canvas-wrap { background: #1f2937; padding: 16px; border:1px solid var(--border); border-top:none; border-radius: 0 0 var(--radius) var(--radius); text-align: center; min-height: 60vh; overflow:auto; }
#pdfCanvas { background: #fff; box-shadow: var(--shadow); }

/* Excel viewer */
.ifkh-xls-wrap { background: var(--surface); border:1px solid var(--border); border-radius: var(--radius); padding: 14px; box-shadow: var(--shadow); }
.ifkh-xls-sheet { overflow:auto; max-width: 100%; }
.ifkh-xls-sheet table { border-collapse: collapse; }
.ifkh-xls-sheet td, .ifkh-xls-sheet th { border:1px solid var(--border); padding: 4px 8px; font-size: 13px; white-space: nowrap; }

/* Login */
.ifkh-login-body { min-height: 100vh; display:flex; align-items:center; justify-content:center; background: linear-gradient(135deg,#eef2ff,#faf5ff); }
.ifkh-login-card { width: 380px; background: #fff; padding: 28px; border-radius: 14px; box-shadow: 0 30px 60px rgba(15,23,42,.15); }
.ifkh-login-brand { display:flex; align-items:center; gap:10px; font-weight:700; margin-bottom: 18px; }

/* Toasts */
.ifkh-toast-stack { position: fixed; bottom: 20px; right: 20px; display:flex; flex-direction:column; gap:8px; z-index: 9999; }

.ifkh-empty-state { text-align:center; padding: 80px 20px; color: var(--muted); }

/* Mobile */
@media (max-width: 992px) {
  .ifkh-app { grid-template-columns: 1fr; }
  .ifkh-sidebar { position: fixed; left:0; top:0; bottom:0; width: 280px; transform: translateX(-100%); transition: transform .2s; z-index: 1000; }
  .ifkh-sidebar.open { transform: translateX(0); }
  .ifkh-company-grid { grid-template-columns: 1fr; }
}

.ifkh-note-body table{
    width:100%;
    border-collapse:collapse;
}

.ifkh-note-body table td,
.ifkh-note-body table th{
    border:1px solid #ddd;
    padding:8px;
}

.ifkh-note-body{
    overflow-wrap:break-word;
}

/* Notes content */

.ifkh-note-body,
.ifkh-note-preview{
    overflow-wrap:break-word;
    word-break:break-word;
}

/* Small images inside notes */

.ifkh-note-body img,
.ifkh-note-preview img{

    max-width:220px;
    max-height:150px;

    width:auto;
    height:auto;

    display:block;
    margin:12px auto;

    border-radius:10px;
    cursor:pointer;

    object-fit:contain;

    transition:.25s;
}

.ifkh-note-body img:hover,
.ifkh-note-preview img:hover{

    transform:scale(1.05);
}

/* Tables */

.ifkh-note-body table{
    width:100%;
    border-collapse:collapse;
}

.ifkh-note-body td,
.ifkh-note-body th{

    border:1px solid #ddd;
    padding:8px;
}

/* Popup */

.ifkh-lightbox{

    display:none;

    position:fixed;
    inset:0;

    background:rgba(0,0,0,.92);

    z-index:999999;

    justify-content:center;
    align-items:center;

    padding:40px;
}

/* Popup image only */

#popupImage{

    max-width:90vw !important;
    max-height:90vh !important;

    width:auto !important;
    height:auto !important;

    object-fit:contain;

    background:#fff;

    border-radius:12px;

    padding:10px;

    box-shadow:0 0 30px rgba(0,0,0,.5);
}

.ifkh-lightbox-close{

    position:absolute;

    top:15px;
    right:25px;

    color:#fff;

    font-size:40px;

    cursor:pointer;

    line-height:1;

    z-index:9999999;
}

/* Slightly bigger quick notes */

.ifkh-right{
    width:360px;
}

.ifkh-note-preview{
    max-height:250px;
    overflow:hidden;
}