/* Theme toggle - global version */
:root{
  --bg:#f6f8fb;--text:#101828;--muted:#667085;--panel:#ffffff;--panel-2:#fafafa;--border:#eaecf0;--border-2:#d0d5dd;
  --hover:#f2f4f7;--active:#2563eb;--primary:#2563eb;--danger:#be123c;
}
:root[data-theme="dark"]{
  --bg:#0b1220;--text:#e5e7eb;--muted:#9ca3af;--panel:#111827;--panel-2:#1f2937;--border:#334155;--border-2:#475569;
  --hover:#1e293b;--active:#1d4ed8;--primary:#3b82f6;--danger:#f43f5e;
}
html,body{background:var(--bg)!important;color:var(--text)!important}
body.login-page{
  background-color:#f7fbff !important;
  background-image:
    radial-gradient(circle at 12% 18%, rgba(37,99,235,.18) 0, rgba(37,99,235,0) 30%),
    radial-gradient(circle at 88% 12%, rgba(6,182,212,.16) 0, rgba(6,182,212,0) 28%),
    linear-gradient(90deg, rgba(59,130,246,.12) 1px, transparent 1px),
    linear-gradient(0deg, rgba(59,130,246,.10) 1px, transparent 1px),
    linear-gradient(135deg, #ffffff 0%, #f3f8ff 48%, #edf5ff 100%) !important;
  background-size:auto,auto,56px 56px,56px 56px,auto !important;
  background-position:center,center,center,center,center !important;
  background-attachment:fixed !important;
}
:root[data-theme="dark"] body.login-page{
  background:
    radial-gradient(circle at 20% 20%, rgba(37,99,235,.18) 0, rgba(37,99,235,0) 40%),
    radial-gradient(circle at 82% 14%, rgba(14,165,233,.14) 0, rgba(14,165,233,0) 36%),
    linear-gradient(130deg, rgba(148,163,184,.10) 1px, transparent 1px),
    linear-gradient(40deg, rgba(56,189,248,.08) 1px, transparent 1px),
    linear-gradient(180deg, #0b1220 0%, #111a2e 55%, #16233a 100%) !important;
  background-size:auto,auto,42px 42px,42px 42px,auto !important;
  background-attachment:fixed !important;
}
h1,h2,h3,h4,strong,b,.title{color:var(--text)!important}
.top,.sidebar,.panel,.card,.user-dropdown,table th,.oc-toast,.copy-toast{background:var(--panel)!important;color:var(--text)!important;border-color:var(--border)!important}
table th{background:var(--panel-2)!important}
th,td,.toolbar,.pagination,.card,.page-btn,.btn,.input,.filters input,.filters select,.oc-select,.seg,.seg button,.avatar-btn,.page-jump input,.page-jump button,.bulk-del,input,select,textarea{border-color:var(--border-2)!important}
input,select,textarea,.input,.filters input,.filters select,.oc-select,.page-jump input{background:var(--panel)!important;color:var(--text)!important}
/* keep dropdown indicator visible for page-size selects */
.page-size .oc-select,
.page-size select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%23667085' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:right 8px center !important;
  padding-right:30px !important;
}
:root[data-theme="dark"] .page-size .oc-select,
:root[data-theme="dark"] .page-size select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%23cbd5e1' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}
.muted,.label,.meta,.profile-name,.mono,.page-meta,.sub,.k{color:var(--muted)!important}
.menu-head,.menu-link,.thlink,.user-dropdown a,.page-btn,.v{color:var(--text)!important;background:transparent}
.btn-secondary{background:var(--primary)!important;color:#fff!important}
.user-dropdown a.logout{color:#dc2626!important;font-weight:700}
.user-dropdown a.logout:hover{background:#fff1f2!important;color:#be123c!important}
:root[data-theme="dark"] .user-dropdown a.logout{color:#f87171!important}
:root[data-theme="dark"] .user-dropdown a.logout:hover{background:#3f1d24!important;color:#fecaca!important}

/* segmented filter readability */
.seg{background:var(--panel-2)!important}
.seg button{color:var(--muted)!important;background:transparent!important}
.seg button:hover{background:var(--hover)!important;color:var(--text)!important}
.seg button.active{background:var(--primary)!important;color:#fff!important;font-weight:700}

.menu-head:hover,.menu-link:hover,.user-dropdown a:hover,.page-btn:hover{background:var(--hover)!important}
.menu-link.active,.page-btn.active{background:var(--active)!important;color:#fff!important}
.btn-primary{background:var(--primary)!important;border-color:var(--primary)!important;color:#fff!important}
.btn-secondary{background:var(--primary)!important;border-color:var(--primary)!important;color:#fff!important}

/* pagination readability in dark mode (aligned with segmented control style) */
:root[data-theme="dark"] .pagination,
:root[data-theme="dark"] .page-meta,
:root[data-theme="dark"] .meta{color:var(--muted)!important}
:root[data-theme="dark"] .page-btn,
:root[data-theme="dark"] .page-jump button,
:root[data-theme="dark"] .page-size .oc-select,
:root[data-theme="dark"] .page-size select{background-color:var(--panel-2)!important;color:var(--text)!important;border-color:var(--border-2)!important}
:root[data-theme="dark"] .page-btn:hover,
:root[data-theme="dark"] .page-jump button:hover{background:var(--hover)!important;color:var(--text)!important}
:root[data-theme="dark"] .page-btn.active{background:var(--primary)!important;color:#fff!important;border-color:var(--primary)!important}
:root[data-theme="dark"] .page-jump input{background:var(--panel-2)!important;color:var(--text)!important;border-color:var(--border-2)!important}
:root[data-theme="dark"] .page-jump input::placeholder{color:var(--muted)!important}

/* current directory path chip readability (share management) */
:root[data-theme="dark"] .crumb .path{background:var(--panel-2)!important;color:var(--text)!important;border:1px solid var(--border-2)!important}
.btn-danger{background:#dc2626!important;border-color:#dc2626!important;color:#fff!important}
.op-del{color:var(--danger)!important}
.tag.off,.input.readonly{background:var(--panel-2)!important}
:root[data-theme="dark"] .tag.off{background:#334155!important;color:#e2e8f0!important;border:1px solid #64748b!important}
:root[data-theme="dark"] .err{background:#3b1212!important;border-color:#7f1d1d!important;color:#fecaca!important}
:root[data-theme="dark"] .ok{background:#052e1d!important;border-color:#14532d!important;color:#bbf7d0!important}

/* readability fixes (dark only) */
:root[data-theme="dark"] .user-name,
:root[data-theme="dark"] .users-text,
:root[data-theme="dark"] .users-panel-title,
:root[data-theme="dark"] .role-pill,
:root[data-theme="dark"] .role-tag,
:root[data-theme="dark"] .user-chip{color:var(--text)!important}
:root[data-theme="dark"] .user-chip,
:root[data-theme="dark"] .chip,
:root[data-theme="dark"] .role-tag,
:root[data-theme="dark"] .role-pill{
  background:rgba(71,85,105,.32)!important;
  border:1px solid rgba(100,116,139,.55)!important;
  color:#e5e7eb!important;
}
/* keep share-status chips true-to-meaning in dark mode */
:root[data-theme="dark"] .chip.on{background:#14532d!important;color:#bbf7d0!important;border-color:#166534!important}
:root[data-theme="dark"] .chip.off{background:#1f2937!important;color:#d1d5db!important;border-color:#475569!important}
:root[data-theme="dark"] .users-panel{background:var(--panel-2)!important;border-color:var(--border)!important}
:root[data-theme="dark"] .hint,
:root[data-theme="dark"] .perm-desc,
:root[data-theme="dark"] .group-title{color:#cbd5e1!important}
.oc-note{background:var(--panel-2)!important;border-color:var(--border)!important;color:var(--muted)!important}

/* dark scrollbar for permission lists/panels */
:root[data-theme="dark"] .users-caps,
:root[data-theme="dark"] .left,
:root[data-theme="dark"] .right,
:root[data-theme="dark"] .modal-card,
:root[data-theme="dark"] .users-panel,
:root[data-theme="dark"] .group,
:root[data-theme="dark"] .group-list{
  scrollbar-color:#475569 #1f2937;
  scrollbar-width:thin;
}
:root[data-theme="dark"] .users-caps::-webkit-scrollbar,
:root[data-theme="dark"] .left::-webkit-scrollbar,
:root[data-theme="dark"] .right::-webkit-scrollbar,
:root[data-theme="dark"] .modal-card::-webkit-scrollbar,
:root[data-theme="dark"] .users-panel::-webkit-scrollbar,
:root[data-theme="dark"] .group::-webkit-scrollbar,
:root[data-theme="dark"] .group-list::-webkit-scrollbar{width:8px;height:8px}
:root[data-theme="dark"] .users-caps::-webkit-scrollbar-track,
:root[data-theme="dark"] .left::-webkit-scrollbar-track,
:root[data-theme="dark"] .right::-webkit-scrollbar-track,
:root[data-theme="dark"] .modal-card::-webkit-scrollbar-track,
:root[data-theme="dark"] .users-panel::-webkit-scrollbar-track,
:root[data-theme="dark"] .group::-webkit-scrollbar-track,
:root[data-theme="dark"] .group-list::-webkit-scrollbar-track{background:#1f2937}
:root[data-theme="dark"] .users-caps::-webkit-scrollbar-thumb,
:root[data-theme="dark"] .left::-webkit-scrollbar-thumb,
:root[data-theme="dark"] .right::-webkit-scrollbar-thumb,
:root[data-theme="dark"] .modal-card::-webkit-scrollbar-thumb,
:root[data-theme="dark"] .users-panel::-webkit-scrollbar-thumb,
:root[data-theme="dark"] .group::-webkit-scrollbar-thumb,
:root[data-theme="dark"] .group-list::-webkit-scrollbar-thumb{background:#475569;border-radius:999px;border:2px solid #1f2937}

/* permission modal internals (dark only) */
:root[data-theme="dark"] .modal-card,
:root[data-theme="dark"] .modal-main .left,
:root[data-theme="dark"] .modal-main .right,
:root[data-theme="dark"] .group{background:var(--panel)!important;color:var(--text)!important;border-color:var(--border)!important}
:root[data-theme="dark"] .group{background:var(--panel-2)!important}
:root[data-theme="dark"] .group-title,
:root[data-theme="dark"] .perm-desc,
:root[data-theme="dark"] .hint{color:var(--muted)!important}

mark{background:#facc15;color:#111827}
[id$="Modal"]{background:rgba(2,6,23,.62)!important}
[id$="Modal"]>div,[id="deleteModal"]>div,[id="batchDeleteModal"]>div{background:var(--panel)!important;border-color:var(--border)!important;color:var(--text)!important}
[style*="background:#fff"],[style*="background: #fff"]{background:var(--panel)!important}
[style*="color:#101828"],[style*="color: #101828"],[style*="color:#475467"],[style*="color:#344054"],[style*="color: #344054"]{color:var(--text)!important}
.theme-toggle-btn{width:36px;height:36px;border-radius:10px;border:0;background:transparent;color:var(--text);cursor:pointer;font-size:16px;line-height:1;display:inline-flex;align-items:center;justify-content:center;box-shadow:none}
.theme-toggle-btn:hover{background:transparent;opacity:.82}

/* avoid "darkening" effect on icon hover in light mode */
:root:not([data-theme="dark"]) .op-icon:hover{opacity:1!important;filter:none!important;background:#f8fafc;border-radius:6px}

/* global navigation loading overlay */
.oc-global-loading{position:fixed;inset:0;z-index:12000;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.70);backdrop-filter:saturate(140%) blur(2px);opacity:0;visibility:hidden;transition:opacity .12s ease,visibility .12s ease}
.oc-global-loading.active{opacity:1;visibility:visible}
.oc-global-loading .box{display:flex;flex-direction:column;align-items:center;gap:10px}
.oc-global-loading .dot{width:40px;height:40px;border-radius:999px;border:3px solid #dbeafe;border-top-color:#2563eb;animation:ocspin .85s linear infinite}
.oc-global-loading .txt{font-size:13px;font-weight:600;color:#1d4ed8}
:root[data-theme="dark"] .oc-global-loading{background:rgba(2,6,23,.62)}
:root[data-theme="dark"] .oc-global-loading .dot{border-color:#334155;border-top-color:#60a5fa}
:root[data-theme="dark"] .oc-global-loading .txt{color:#bfdbfe}
@keyframes ocspin{to{transform:rotate(360deg)}}

/* floating idle lock countdown */
.oc-floating-countdown{position:fixed;left:18px;bottom:18px;z-index:9998;min-width:120px;padding:10px 12px;border:1px solid var(--border)!important;border-radius:12px;background:var(--panel-2)!important;text-align:center;box-shadow:0 8px 20px rgba(15,23,42,.12);opacity:0;pointer-events:none;transform:translateY(8px);transition:opacity .25s ease,transform .25s ease}
.oc-floating-countdown.visible{opacity:1;pointer-events:auto;transform:translateY(0)}
.oc-floating-countdown .v{font-size:28px;line-height:1;font-weight:800;color:var(--primary)!important;letter-spacing:.5px}
.oc-floating-countdown .k{margin-top:6px;font-size:12px;color:var(--muted)!important}
.oc-floating-countdown.warn .v{color:#f59e0b!important}
.oc-floating-countdown.danger .v{color:#ef4444!important}

.oc-force-logout-mask{position:fixed;inset:0;z-index:22000;display:none;align-items:center;justify-content:center;background:rgba(2,6,23,.62)}
.oc-force-logout-card{min-width:320px;max-width:86vw;border-radius:16px;background:var(--panel)!important;border:1px solid var(--border)!important;padding:18px;text-align:center;box-shadow:0 18px 40px rgba(0,0,0,.28)}
.oc-force-logout-card .t{font-size:18px;font-weight:800;color:#b42318}
.oc-force-logout-card .s{margin-top:6px;font-size:13px;color:var(--muted)!important}
.oc-force-logout-card .n{margin-top:10px;font-size:38px;font-weight:900;color:#ef4444;line-height:1}