.phase6-designer{display:grid;grid-template-columns:260px minmax(380px,1fr) 320px;gap:16px;align-items:start}
.phase6-panel{padding:16px}
.phase6-toolbar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.phase6-chip{padding:8px 12px;border:1px solid var(--line);background:var(--surface-2);border-radius:999px;font-size:.92rem;cursor:pointer}
.phase6-chip.active{background:var(--primary);border-color:var(--primary);color:#fff}
.phase6-layer-list,.phase6-template-list{display:grid;gap:8px;max-height:280px;overflow:auto}
.phase6-layer,.phase6-template-item{display:flex;justify-content:space-between;gap:8px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--surface-2)}
.phase6-layer.active{outline:2px solid var(--primary);border-color:var(--primary)}
.phase6-layer small{display:block;color:var(--muted)}
.phase6-mini-actions{display:flex;gap:6px;flex-wrap:wrap}
.phase6-mini-actions button{padding:6px 8px;border-radius:10px}
.phase6-designer .card h3{margin-bottom:12px}
.phase6-settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.phase6-settings-grid .full{grid-column:1/-1}
.phase6-canvas-wrap{position:relative;background:linear-gradient(0deg, rgba(17,183,230,.06), rgba(17,183,230,.06)), var(--surface-2);border:1px solid var(--line);border-radius:22px;padding:16px;min-height:720px;overflow:auto}
.phase6-canvas-stage{min-width:max-content;min-height:max-content;display:flex;align-items:flex-start;justify-content:center}
.phase6-canvas{position:relative;background:#fff;border:2px solid #111;border-radius:18px;box-shadow:0 20px 40px rgba(15,23,42,.12);background-image:linear-gradient(to right, rgba(15,23,42,.06) 1px, transparent 1px),linear-gradient(to bottom, rgba(15,23,42,.06) 1px, transparent 1px);background-size:20px 20px;overflow:hidden}
.phase6-canvas .drag-item{position:absolute;cursor:move;user-select:none;touch-action:none;box-sizing:border-box}
.phase6-canvas .drag-item.selected{outline:2px dashed #11b7e6;outline-offset:2px}
.phase6-canvas .drag-item.text{padding:2px 4px;white-space:pre-line;line-height:1.15}
.phase6-canvas .drag-item.image img{width:100%;height:100%;object-fit:contain;border-radius:12px}
.phase6-canvas .drag-item.barcode svg{width:100%;height:100%}
.phase6-canvas .drag-item.qr img{width:100%;height:100%;object-fit:cover;border:1px solid #111;border-radius:6px;background:#fff}
.phase6-canvas .drag-item.line{background:#111}
.phase6-canvas .drag-item.box{border:2px solid #111;background:rgba(255,255,255,.88)}
.phase6-canvas .resize-handle{position:absolute;right:-7px;bottom:-7px;width:14px;height:14px;border-radius:50%;background:#11b7e6;border:2px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.2);cursor:nwse-resize}
.phase6-canvas .drag-item:not(.selected) .resize-handle{display:none}
.phase6-canvas-topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
.phase6-zoom{display:flex;align-items:center;gap:8px}
.phase6-zoom input{width:140px}
.phase6-inspector-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.phase6-inspector-grid .full{grid-column:1/-1}
.phase6-empty{padding:18px;text-align:center;color:var(--muted)}
.phase6-help{font-size:.92rem;color:var(--muted);margin-top:8px}
.phase6-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;background:var(--surface-2);border:1px solid var(--line);border-radius:999px;font-size:.86rem}
.app-shell.dark .phase6-canvas-wrap{background:linear-gradient(0deg, rgba(17,183,230,.05), rgba(17,183,230,.05)), #081420}
.app-shell.dark .phase6-canvas{box-shadow:0 20px 40px rgba(0,0,0,.35)}
@media (max-width:1280px){.phase6-designer{grid-template-columns:1fr}.phase6-canvas-wrap{min-height:500px}.phase6-panel{order:2}.phase6-canvas-panel{order:1}}

.phase6-add-panel{margin-top:14px;padding:12px;border:1px solid var(--line);border-radius:16px;background:var(--surface-2)}
.phase6-add-list{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 12px}
.phase6-add-list .ghost{padding:8px 10px;border-radius:10px}
.phase6-logo-tools{display:grid;gap:10px}
.phase6-logo-tools input[type=file]{padding:8px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
#p6CanvasHost .label-paper{padding:0;border:2px solid #111;overflow:hidden;box-shadow:0 18px 36px rgba(15,23,42,.12)}
#p6CanvasHost .phase6-canvas{border:none;border-radius:16px;box-shadow:none;background-size:20px 20px}
.phase6-canvas .drag-item.image{background:transparent}
.phase6-canvas .drag-item.text{min-width:24px}
.phase6-canvas-wrap{position:relative}
.phase6-canvas-stage{padding:24px 16px}

.phase6-canvas.no-grid{background-image:none !important}
.phase6-canvas-panel,.phase6-inspector-panel{position:relative;top:auto;align-self:start}
@media (max-width:1280px){.phase6-canvas-panel,.phase6-inspector-panel{position:static;top:auto}}

.phase6-toolbar{flex-wrap:nowrap}
.phase6-settings-grid.compact-two{grid-template-columns:repeat(2,minmax(0,1fr))}
.phase6-settings-grid.compact-two .full{grid-column:1/-1}
.phase6-canvas-topbar{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"actions zoom" "actions grid";align-items:center;column-gap:12px;row-gap:8px}
.phase6-canvas-topbar .button-wrap{flex-wrap:nowrap;gap:8px}
.phase6-grid-toggle{display:inline-flex;align-items:center;gap:8px;font-weight:700}
.phase6-grid-toggle input[type=checkbox]{width:16px;height:16px;min-height:16px;accent-color:var(--primary)}
.phase6-grid-toggle span{font-weight:700}
.phase6-inspector-panel{max-height:calc(100vh - var(--kls-sticky-top, 18px) - 16px);overflow:auto}
@media (max-width: 1280px){
  .phase6-toolbar{flex-wrap:wrap}
  .phase6-canvas-topbar{grid-template-columns:1fr;grid-template-areas:"actions" "zoom" "grid";justify-items:start}
  .phase6-canvas-topbar .button-wrap{flex-wrap:wrap}
}

.phase6-canvas-topbar .button-wrap{grid-area:actions;align-self:start}
.phase6-canvas-topbar .phase6-zoom{grid-area:zoom;justify-self:start}
.phase6-canvas-topbar .phase6-grid-toggle{grid-area:grid;justify-self:start;margin-left:0}
.phase6-grid-toggle{margin-top:2px}
.phase6-grid-toggle input[type=checkbox]{width:14px;height:14px;min-height:14px}

.phase6-designer-label{padding:0;border:2px solid #111;overflow:hidden;box-shadow:0 18px 36px rgba(15,23,42,.12);background:#fff}
.phase6-designer-label .phase6-canvas{background-color:#fff}


/* v1.6.23 topbar layout polish */
.phase6-canvas-topbar{grid-template-columns:1fr;grid-template-areas:"actions" "zoom" "grid";justify-items:start;align-items:start}
.phase6-canvas-topbar .button-wrap{flex-wrap:nowrap;gap:8px;overflow-x:auto;max-width:100%;padding-bottom:2px}
.phase6-canvas-topbar .button-wrap button{padding:8px 12px;min-height:40px;font-size:.95rem;line-height:1.1;border-radius:14px;white-space:nowrap}
.phase6-canvas-topbar .phase6-zoom{width:100%;max-width:340px;display:grid;grid-template-columns:auto minmax(120px,1fr) auto;align-items:center;gap:10px}
.phase6-canvas-topbar .phase6-zoom input{width:100%;min-width:0}
.phase6-canvas-topbar .phase6-grid-toggle{margin-top:0}
@media (max-width: 768px){
  .phase6-canvas-topbar .button-wrap{flex-wrap:wrap;overflow:visible}
  .phase6-canvas-topbar .button-wrap button{padding:8px 10px;min-height:38px;font-size:.92rem}
  .phase6-canvas-topbar .phase6-zoom{max-width:100%}
}


.phase6-generated.label-paper{border:2px solid #111;overflow:hidden;background:#fff;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.phase6-generated .phase6-canvas{background-color:#fff}


/* v2.1.33 Generated label printable/live frame */
.phase6-generated.label-paper{position:relative!important;box-sizing:border-box!important;border:2px solid #111!important;box-shadow:inset 0 0 0 2px #111!important;overflow:hidden!important;background:#fff!important;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
.phase6-generated.label-paper::after{content:"";position:absolute;inset:0;border:2px solid #111;border-radius:inherit;pointer-events:none;box-sizing:border-box;z-index:9999;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.phase6-generated .phase6-canvas{background-color:#fff!important;overflow:hidden!important}

/* v2.1.42 Template Design PRO UI Final Match */
#view-templates .phase6-pro-page{--p6-blue:#0b72f0;--p6-cyan:#16bfd5;--p6-soft:#f7fbff;--p6-line:#dbe8f5;--p6-ink:#0f1b2d;--p6-muted:#66809c;}
#view-templates .phase6-pro-topbar{margin-bottom:10px;align-items:flex-start}
#view-templates .phase6-pro-topbar h2{font-size:28px;letter-spacing:-.03em;margin-bottom:2px;color:var(--p6-ink)}
#view-templates .phase6-badge{border-color:#dbe8f5;background:#fff;border-radius:999px;color:#0f1b2d;padding:9px 14px;font-weight:700;box-shadow:0 10px 26px rgba(15,23,42,.04)}
.phase6-pro-tabs{display:flex;gap:0;border-bottom:1px solid var(--p6-line);margin:0 0 14px 0;padding-left:0}
.phase6-pro-tab{display:inline-flex;align-items:center;gap:9px;border:1px solid var(--p6-line);border-bottom:0;background:#fff;color:#334155;padding:13px 24px;border-radius:12px 12px 0 0;font-weight:800;min-width:178px;justify-content:center;cursor:pointer;transition:.18s ease}
.phase6-pro-tab.active{background:#f9fcff;border-color:#1d7dff;color:#0764dd;box-shadow:inset 0 -2px 0 #1d7dff}
.phase6-tab-icon{font-size:17px;color:#0b72f0}
.phase6-pro-actionbar{display:grid;grid-template-columns:auto auto auto 1px auto auto 1px auto auto auto;align-items:center;gap:10px;margin-bottom:12px}
.phase6-pro-actionbar button{min-height:42px;border-radius:12px;font-weight:800;display:inline-flex;align-items:center;gap:8px;justify-content:center;white-space:nowrap}
.phase6-save-main{padding:0 20px;background:linear-gradient(135deg,#0875ff,#16bfd5)!important;border:0!important;box-shadow:0 14px 28px rgba(0,104,255,.18)}
.phase6-toolbar-sep{display:block;width:1px;height:34px;background:var(--p6-line);margin:0 6px}
.phase6-zoom.pro{display:grid;grid-template-columns:36px minmax(100px,150px) auto 36px;align-items:center;gap:8px;background:#fff;border:1px solid var(--p6-line);border-radius:12px;padding:3px 5px;min-height:42px}
.phase6-zoom.pro input{width:100%;accent-color:#0b72f0}
.phase6-zoom.pro .ghost,.phase6-square-btn{min-height:32px!important;height:32px!important;border-radius:9px!important;padding:0 10px!important}
.phase6-workspace{display:grid;grid-template-columns:250px 270px minmax(520px,1fr) 300px;gap:12px;align-items:start;transition:grid-template-columns .2s ease;min-height:680px}
.phase6-workspace.p6-setup-collapsed{grid-template-columns:58px 270px minmax(520px,1fr) 300px}
.phase6-workspace.p6-layers-collapsed{grid-template-columns:250px 58px minmax(520px,1fr) 300px}
.phase6-workspace.p6-inspector-collapsed{grid-template-columns:250px 270px minmax(520px,1fr) 58px}
.phase6-workspace.p6-setup-collapsed.p6-layers-collapsed{grid-template-columns:58px 58px minmax(520px,1fr) 300px}
.phase6-workspace.p6-setup-collapsed.p6-inspector-collapsed{grid-template-columns:58px 270px minmax(520px,1fr) 58px}
.phase6-workspace.p6-layers-collapsed.p6-inspector-collapsed{grid-template-columns:250px 58px minmax(520px,1fr) 58px}
.phase6-workspace.p6-setup-collapsed.p6-layers-collapsed.p6-inspector-collapsed{grid-template-columns:58px 58px minmax(520px,1fr) 58px}
.phase6-pro-panel{background:#fff;border:1px solid var(--p6-line);border-radius:18px;box-shadow:0 18px 45px rgba(15,23,42,.06);padding:12px;min-width:0;box-sizing:border-box}
.phase6-pro-panel-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px;min-height:34px}
.phase6-pro-panel-title{display:flex;align-items:center;gap:9px;color:#0f1b2d;font-weight:900;font-size:15px;white-space:nowrap;min-width:0}
.phase6-head-icon{width:24px;height:24px;border-radius:8px;display:inline-grid;place-items:center;background:#eff6ff;color:#0b72f0;border:1px solid #dbeafe;flex:0 0 auto}
.phase6-collapse-btn{width:30px;height:30px;border-radius:10px;border:1px solid var(--p6-line);background:#fff;color:#5f7892;cursor:pointer;font-size:20px;line-height:1;display:grid;place-items:center;transition:.18s ease}
.phase6-collapse-btn:hover{background:#eff6ff;color:#0b72f0;border-color:#bfdcff}
.phase6-pro-panel.is-collapsed{padding:10px 8px;overflow:hidden;min-height:320px}
.phase6-pro-panel.is-collapsed .phase6-panel-body{display:none!important}
.phase6-pro-panel.is-collapsed .phase6-pro-panel-head{height:100%;align-items:flex-start;justify-content:flex-start;flex-direction:column;margin:0}
.phase6-pro-panel.is-collapsed .phase6-pro-panel-title{writing-mode:vertical-rl;transform:rotate(180deg);margin:auto;font-size:14px}
.phase6-pro-panel.is-collapsed .phase6-collapse-btn{transform:rotate(180deg);margin:0 auto}
.phase6-panel-body{display:block}
.phase6-settings-grid{gap:10px}
.phase6-settings-grid label span{font-size:12px;font-weight:800;color:#334155;margin-bottom:6px}
.phase6-settings-grid input,.phase6-settings-grid select,.phase6-inspector-grid input,.phase6-inspector-grid select{height:42px;border:1px solid var(--p6-line);border-radius:11px;background:#fff;color:#0f1b2d;padding:0 12px;font-weight:700;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}
.phase6-info-box{font-size:12px;line-height:1.35;color:#1760bf;background:#eef6ff;border:1px solid #cfe4ff;border-radius:12px;padding:11px 12px;margin:12px 0;font-weight:700}
.phase6-info-box.mini{font-size:11px;margin-top:10px}
.phase6-pro-add-panel{margin:14px 0 12px;border-radius:16px;padding:12px;background:#fff;border-color:#dbe8f5}
.phase6-add-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.phase6-add-head h3{margin:0;font-size:15px;color:#0f1b2d}.phase6-mini-close{width:30px;height:30px;border-radius:10px;padding:0!important}
.phase6-add-list{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0!important}
.phase6-add-tile{height:58px;border:1px solid #dbe8f5;border-radius:11px;background:#fafdff;display:grid;place-items:center;gap:2px;cursor:pointer;font-weight:800;color:#0f1b2d;transition:.18s ease}
.phase6-add-tile b{font-size:18px;color:#0b72f0}.phase6-add-tile span{font-size:11px}.phase6-add-tile:hover{border-color:#0b72f0;box-shadow:0 10px 22px rgba(11,114,240,.12);transform:translateY(-1px)}
.phase6-default-adds{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;border-top:1px solid #edf4fb;padding-top:8px}.phase6-default-adds small{width:100%;color:#64748b;font-weight:800}
.phase6-logo-tools{margin-top:12px}.phase6-logo-tools input[type=file]{border-color:#dbe8f5;background:#fff;border-radius:12px}.phase6-saved-wrap h3{font-size:15px;margin:14px 0 8px}.phase6-template-list{max-height:170px}
.phase6-layer-tools{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.phase6-layer-subtitle{font-weight:900;font-size:13px;color:#334155}.phase6-icon-btn{width:32px;height:32px;padding:0!important;border-radius:10px!important}.phase6-layer-list{max-height:520px;gap:8px}.phase6-layer-group{display:grid;gap:7px}.phase6-layer-group-title{display:flex;align-items:center;gap:8px;margin:4px 0;color:#64748b;font-weight:900;font-size:12px}.phase6-layer-group-title em{font-style:normal;background:#eef6ff;color:#0b72f0;border-radius:999px;padding:2px 7px}
.phase6-layer{display:grid!important;grid-template-columns:16px 24px 1fr 24px 24px;align-items:center;gap:8px;min-height:42px;border-radius:12px;background:#fff;padding:8px 10px;border:1px solid #e2ecf6;box-shadow:none;text-align:left;width:100%;cursor:pointer;color:#0f1b2d}
.phase6-layer.active{border-color:#1d7dff;outline:none;box-shadow:0 0 0 2px rgba(29,125,255,.13)}.phase6-layer.mapped{background:#fbfffd}.phase6-drag-dots{color:#94a3b8;font-weight:900}.phase6-layer-kind{color:#334155;display:grid;place-items:center}.phase6-layer strong{font-size:12px}.phase6-layer small{font-size:10px;color:#64748b}.phase6-eye{color:#0b72f0}.phase6-map-icon{color:#16a34a;font-size:13px}.phase6-wide-add{width:100%;margin:10px 0;border-color:#1d7dff!important;color:#0b72f0!important;font-weight:900!important}.phase6-layer-actions{margin-top:10px;gap:7px}.phase6-layer-actions button{font-size:12px;border-radius:11px;padding:8px 10px!important}
.phase6-canvas-panel{padding:0!important;background:#fff!important;border-radius:18px!important;overflow:hidden}.phase6-canvas-shell{position:relative;background:#fff;border-radius:18px;overflow:hidden}.phase6-ruler-x{height:34px;margin-left:34px;display:grid;grid-template-columns:repeat(6,1fr);align-items:end;color:#64748b;font-size:11px;font-weight:800;border-bottom:1px solid #e2ecf6;background:linear-gradient(to right, transparent 0, transparent calc(100% - 1px), #e2ecf6 calc(100% - 1px));background-size:80px 100%}.phase6-ruler-x span{padding:0 0 6px 4px}.phase6-ruler-y{position:absolute;top:34px;left:0;width:34px;bottom:54px;display:grid;grid-template-rows:24px repeat(6,1fr);justify-items:center;color:#64748b;font-size:11px;font-weight:800;border-right:1px solid #e2ecf6;background:#fff;z-index:2}.phase6-canvas-wrap{margin-left:34px;border:0!important;border-radius:0!important;background:#fff!important;padding:20px!important;min-height:630px!important;overflow:auto!important}.phase6-canvas-stage{min-height:560px;display:flex;justify-content:center;align-items:flex-start;background-image:linear-gradient(to right, rgba(11,114,240,.08) 1px, transparent 1px),linear-gradient(to bottom, rgba(11,114,240,.08) 1px, transparent 1px);background-size:18px 18px;border:1px solid #e2ecf6}.phase6-bottom-tools{height:54px;border-top:1px solid #e2ecf6;display:flex;align-items:center;justify-content:center;gap:12px;background:#fff}.phase6-device-btn{width:44px;height:36px;border-radius:10px!important;padding:0!important}.phase6-grid-toggle{font-weight:900;background:#fff;border:1px solid #e2ecf6;border-radius:12px;padding:8px 12px}.phase6-grid-toggle input{accent-color:#0b72f0}
#p6CanvasHost .label-paper{box-shadow:0 24px 48px rgba(15,23,42,.12)!important}.phase6-canvas .drag-item.selected{outline:2px dashed #4b93ff!important;outline-offset:3px}.phase6-canvas .resize-handle{background:#0b92ff!important;width:12px!important;height:12px!important}
.phase6-inspector-panel{max-height:none!important;overflow:visible!important}.phase6-inspector-tabs{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--p6-line);border-radius:12px;overflow:hidden;margin-bottom:12px}.phase6-inspector-tabs button{height:38px;border:0;background:#fff;font-weight:900;color:#64748b}.phase6-inspector-tabs button.active{color:#0b72f0;background:#eff6ff;box-shadow:inset 0 0 0 1px #0b72f0}.phase6-inspector-grid{display:block!important}.phase6-layer-select{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:end;margin-bottom:10px}.phase6-status-chip{display:inline-flex;align-items:center;height:32px;border-radius:999px;background:#dff8e9;color:#16a34a;padding:0 10px;font-size:11px;font-weight:900}.phase6-inspector-section{border-top:1px solid #edf4fb;padding:9px 0}.phase6-inspector-section summary{cursor:pointer;font-weight:900;color:#0f1b2d;list-style:none;display:flex;justify-content:space-between}.phase6-inspector-section summary::-webkit-details-marker{display:none}.phase6-inspector-section summary:after{content:'⌄';color:#64748b}.phase6-inspector-section[open] summary:after{content:'⌃'}.phase6-inspector-section-body{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:10px}.phase6-inspector-section-body .full{grid-column:1/-1}.phase6-lock-btn{grid-row:span 2;min-height:86px!important;color:#0b72f0!important}.phase6-map-status{grid-column:1/-1;background:#dcfce7;color:#16a34a;border-radius:10px;padding:10px 12px;font-weight:900;text-align:center}.phase6-fullscreen-canvas{position:fixed!important;z-index:99999!important;inset:14px!important;background:#fff!important;padding:0!important}.phase6-fullscreen-canvas .phase6-canvas-wrap{height:calc(100vh - 104px)!important}
@media (max-width:1500px){.phase6-workspace{grid-template-columns:230px 250px minmax(480px,1fr) 280px}.phase6-add-list{grid-template-columns:repeat(2,1fr)}.phase6-pro-actionbar{overflow-x:auto;display:flex}.phase6-toolbar-sep{flex:0 0 1px}}
@media (max-width:1100px){.phase6-workspace,.phase6-workspace.p6-setup-collapsed,.phase6-workspace.p6-layers-collapsed,.phase6-workspace.p6-inspector-collapsed{grid-template-columns:1fr}.phase6-pro-panel.is-collapsed{min-height:auto}.phase6-pro-panel.is-collapsed .phase6-pro-panel-title{writing-mode:initial;transform:none}.phase6-pro-panel.is-collapsed .phase6-pro-panel-head{flex-direction:row}.phase6-pro-tabs{overflow:auto}.phase6-pro-tab{min-width:160px}}

/* v2.1.42 Template Design PRO polish: approved layout fit, real icons, working panels */
#view-templates.active{overflow-x:hidden;}
#view-templates .phase6-pro-page{width:100%;max-width:100%;overflow:hidden;}
#view-templates .phase6-pro-topbar{min-height:0;margin-bottom:12px;}
#view-templates .phase6-pro-topbar .phase6-badge{display:none!important;}
.phase6-svg-icon{width:18px;height:18px;display:inline-block;vertical-align:middle;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto;}
.phase6-head-icon .phase6-svg-icon{width:16px;height:16px;}
.phase6-tab-icon .phase6-svg-icon{width:18px;height:18px;}
.phase6-pro-actionbar{display:flex!important;align-items:center;gap:10px;margin-bottom:16px;overflow-x:auto;overflow-y:hidden;padding-bottom:2px;scrollbar-width:thin;}
.phase6-pro-actionbar::-webkit-scrollbar{height:6px}.phase6-pro-actionbar::-webkit-scrollbar-thumb{background:rgba(11,114,240,.22);border-radius:999px}
.phase6-pro-actionbar .ghost,.phase6-pro-actionbar .primary{height:44px;min-height:44px;border-radius:14px!important;padding:0 17px!important;background:#fff;border:1px solid #dbe8f5;box-shadow:0 10px 24px rgba(15,23,42,.04);color:#0f1b2d;font-size:14px;font-weight:900;}
.phase6-pro-actionbar .ghost:hover{background:#f2f8ff;border-color:#b9d8ff;color:#0963d6;transform:translateY(-1px)}
.phase6-save-main{min-width:190px;color:#fff!important;background:linear-gradient(135deg,#0875ff,#16bfd5)!important;border:0!important;box-shadow:0 16px 30px rgba(0,104,255,.2)!important;}
.phase6-square-btn{width:48px!important;padding:0!important;}
.phase6-toolbar-sep{flex:0 0 1px;height:34px;margin:0 2px;background:#dbe8f5;}
.phase6-zoom.pro{flex:0 0 310px;height:44px;border-radius:14px;background:#fff;border:1px solid #dbe8f5;padding:0 8px;box-shadow:0 10px 24px rgba(15,23,42,.04);}
.phase6-zoom.pro .ghost{width:34px!important;height:34px!important;min-height:34px!important;padding:0!important;border-radius:10px!important;box-shadow:none!important;}
.phase6-zoom.pro input{min-height:0;height:4px;}
.phase6-workspace{width:100%;display:grid;grid-template-columns:minmax(214px,238px) minmax(226px,248px) minmax(410px,1fr) minmax(228px,258px)!important;gap:12px!important;align-items:start;overflow:visible;}
.phase6-workspace.p6-setup-collapsed{grid-template-columns:56px minmax(226px,248px) minmax(430px,1fr) minmax(228px,258px)!important;}
.phase6-workspace.p6-layers-collapsed{grid-template-columns:minmax(214px,238px) 56px minmax(430px,1fr) minmax(228px,258px)!important;}
.phase6-workspace.p6-inspector-collapsed{grid-template-columns:minmax(214px,238px) minmax(226px,248px) minmax(430px,1fr) 56px!important;}
.phase6-workspace.p6-setup-collapsed.p6-layers-collapsed{grid-template-columns:56px 56px minmax(430px,1fr) minmax(228px,258px)!important;}
.phase6-workspace.p6-setup-collapsed.p6-inspector-collapsed{grid-template-columns:56px minmax(226px,248px) minmax(430px,1fr) 56px!important;}
.phase6-workspace.p6-layers-collapsed.p6-inspector-collapsed{grid-template-columns:minmax(214px,238px) 56px minmax(430px,1fr) 56px!important;}
.phase6-workspace.p6-setup-collapsed.p6-layers-collapsed.p6-inspector-collapsed{grid-template-columns:56px 56px minmax(430px,1fr) 56px!important;}
.phase6-pro-panel{border-radius:18px!important;padding:12px!important;box-shadow:0 18px 44px rgba(15,23,42,.07)!important;}
.phase6-pro-panel-head{min-height:36px;margin-bottom:10px;}
.phase6-pro-panel-title strong{font-size:14px;letter-spacing:-.01em;}
.phase6-collapse-btn{width:32px;height:32px;border-radius:12px!important;font-size:0!important;}
.phase6-collapse-btn .phase6-svg-icon{width:16px;height:16px;}
.phase6-pro-panel.is-collapsed{padding:10px 8px!important;min-height:318px;border-radius:18px!important;background:linear-gradient(180deg,#fff,#f8fbff);}
.phase6-pro-panel.is-collapsed .phase6-pro-panel-title{gap:10px;font-size:13px;letter-spacing:.01em;}
.phase6-pro-panel.is-collapsed .phase6-head-icon{width:26px;height:26px;margin:0 auto;}
.phase6-pro-panel.is-collapsed .phase6-collapse-btn{margin:0 auto;background:#f5faff;}
.phase6-canvas-panel{min-width:0!important;}
.phase6-canvas-wrap{min-height:calc(100vh - 325px)!important;max-height:calc(100vh - 240px);padding:18px!important;overflow:auto!important;}
.phase6-canvas-stage{min-height:520px!important;min-width:620px;}
.phase6-ruler-x{height:34px;margin-left:34px;}
.phase6-ruler-y{bottom:52px;}
.phase6-bottom-tools{height:52px;}
.phase6-layer-search{width:100%;height:40px;min-height:40px;margin:0 0 10px;border-radius:12px;border:1px solid #dbe8f5;background:#fff;padding:0 12px;font-size:13px;font-weight:700;}
.phase6-layer-subtitle em{font-style:normal;color:#0b72f0;font-weight:900;}
.phase6-layer-list{max-height:calc(100vh - 392px)!important;min-height:160px;overflow:auto;padding-right:2px;}
.phase6-layer-list::-webkit-scrollbar,.phase6-template-list::-webkit-scrollbar,.phase6-canvas-wrap::-webkit-scrollbar{width:7px;height:7px}.phase6-layer-list::-webkit-scrollbar-thumb,.phase6-template-list::-webkit-scrollbar-thumb,.phase6-canvas-wrap::-webkit-scrollbar-thumb{background:rgba(102,128,156,.28);border-radius:999px}.phase6-layer-list::-webkit-scrollbar-track,.phase6-template-list::-webkit-scrollbar-track,.phase6-canvas-wrap::-webkit-scrollbar-track{background:transparent}
.phase6-layer{grid-template-columns:18px 24px minmax(0,1fr) 22px 22px!important;min-height:44px!important;}
.phase6-layer .phase6-svg-icon{width:16px;height:16px;}
.phase6-drag-dots{display:grid;place-items:center;color:#94a3b8;}
.phase6-layer-kind{color:#375f80;}
.phase6-eye,.phase6-map-icon{display:grid;place-items:center;}
.phase6-map-icon .phase6-svg-icon{stroke:#16a34a;}
.phase6-wide-add{height:46px!important;border-radius:15px!important;background:#fff!important;}
.phase6-layer-actions{display:flex!important;gap:7px!important;}
.phase6-layer-actions button{display:inline-flex;align-items:center;gap:6px;min-height:34px!important;background:#fff!important;}
.phase6-add-panel.is-hidden{display:none!important;}
.phase6-add-head h3{font-size:14px!important;}
.phase6-mini-close{display:grid!important;place-items:center!important;color:#56718b!important;}
.phase6-mini-close .phase6-svg-icon{width:16px;height:16px;}
.phase6-add-tile b{display:grid;place-items:center;color:#0b72f0;}
.phase6-add-tile b .phase6-svg-icon{width:20px;height:20px;}
.phase6-add-tile{height:60px!important;border-radius:14px!important;background:linear-gradient(180deg,#fff,#f7fbff)!important;}
.phase6-logo-tools input[type=file]{height:auto!important;min-height:46px;padding:8px!important;font-weight:700;color:#334155;}
.phase6-logo-tools input[type=file]::file-selector-button{border:0;border-radius:10px;background:#eaf4ff;color:#0b72f0;font-weight:900;padding:8px 12px;margin-right:10px;cursor:pointer;}
.phase6-inspector-tabs{height:40px;border-radius:14px!important;background:#f7fbff;}
.phase6-inspector-tabs button{height:38px!important;border-radius:12px!important;cursor:pointer;}
.phase6-inspector-tabs button.active{background:#eaf4ff!important;box-shadow:inset 0 0 0 1px #0b72f0!important;}
.phase6-inspector-grid,.phase6-inspector-settings{max-height:calc(100vh - 388px);overflow:auto;padding-right:2px;}
.phase6-inspector-settings-grid{gap:10px!important;}
.phase6-lock-btn{display:inline-flex!important;align-items:center;justify-content:center;gap:8px;min-height:86px!important;background:#fff!important;border:1px solid #dbe8f5!important;}
.phase6-lock-btn .phase6-svg-icon{width:18px;height:18px;}
.phase6-empty.compact{padding:12px;font-size:13px;}
@media (max-width:1400px){
  .phase6-workspace{grid-template-columns:minmax(205px,226px) minmax(218px,236px) minmax(390px,1fr) minmax(220px,246px)!important;}
  .phase6-workspace.p6-setup-collapsed{grid-template-columns:54px minmax(218px,236px) minmax(390px,1fr) minmax(220px,246px)!important;}
  .phase6-workspace.p6-layers-collapsed{grid-template-columns:minmax(205px,226px) 54px minmax(390px,1fr) minmax(220px,246px)!important;}
  .phase6-workspace.p6-inspector-collapsed{grid-template-columns:minmax(205px,226px) minmax(218px,236px) minmax(390px,1fr) 54px!important;}
  .phase6-add-list{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media (max-width:1180px){
  .phase6-workspace,.phase6-workspace.p6-setup-collapsed,.phase6-workspace.p6-layers-collapsed,.phase6-workspace.p6-inspector-collapsed,.phase6-workspace.p6-setup-collapsed.p6-layers-collapsed,.phase6-workspace.p6-setup-collapsed.p6-inspector-collapsed,.phase6-workspace.p6-layers-collapsed.p6-inspector-collapsed,.phase6-workspace.p6-setup-collapsed.p6-layers-collapsed.p6-inspector-collapsed{grid-template-columns:1fr!important;}
  .phase6-pro-panel.is-collapsed{min-height:auto!important;}
  .phase6-pro-panel.is-collapsed .phase6-pro-panel-head{height:auto!important;flex-direction:row!important;align-items:center!important;justify-content:space-between!important;}
  .phase6-pro-panel.is-collapsed .phase6-pro-panel-title{writing-mode:initial!important;transform:none!important;margin:0!important;}
  .phase6-pro-panel.is-collapsed .phase6-panel-body{display:none!important;}
  .phase6-canvas-stage{min-width:720px;}
  .phase6-canvas-wrap{max-height:none!important;min-height:520px!important;}
}
@media (max-width:760px){
  #view-templates .phase6-pro-topbar h2{font-size:24px;}
  .phase6-pro-tabs{overflow-x:auto;}
  .phase6-pro-tab{min-width:170px;padding:12px 16px;}
  .phase6-pro-actionbar{gap:8px;}
  .phase6-pro-actionbar .ghost,.phase6-pro-actionbar .primary{height:42px;min-height:42px;padding:0 13px!important;font-size:13px;}
  .phase6-save-main{min-width:160px;}
  .phase6-zoom.pro{flex:0 0 260px;}
  .phase6-add-list{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .phase6-canvas-stage{min-width:620px;}
  .phase6-canvas-wrap{padding:12px!important;}
}
#view-templates .hidden,.phase6-inspector-grid.hidden,.phase6-inspector-settings.hidden,.phase6-layer-search.hidden{display:none!important;}

/* v2.1.42 Template Design interaction cleanup: no duplicate settings, working panel toggles, labelled canvas controls */
.phase6-collapse-btn{cursor:pointer!important;pointer-events:auto!important;z-index:5;display:grid!important;place-items:center!important;transition:all .18s ease!important;}
.phase6-collapse-btn:hover{background:#eaf4ff!important;border-color:#9cc7ff!important;color:#075ee5!important;transform:translateY(-1px);}
.phase6-pro-panel.is-collapsed .phase6-collapse-btn:hover{transform:rotate(180deg) translateY(-1px)!important;}
.phase6-pro-panel-head{position:relative;z-index:3;}
.phase6-editor-settings{display:grid;gap:12px;}
.phase6-settings-note{display:grid;gap:5px;padding:12px;border:1px solid #d7e8fb;background:#f2f8ff;border-radius:14px;color:#113052;font-size:13px;line-height:1.45;}
.phase6-settings-note strong{font-size:14px;color:#0f1b2d;}
.phase6-settings-note span{color:#5b7289;font-weight:700;}
.phase6-settings-note.small{background:#fff;}
.phase6-settings-actions{display:grid;grid-template-columns:1fr;gap:8px;}
.phase6-settings-actions .ghost{min-height:42px!important;display:inline-flex!important;align-items:center;justify-content:center;gap:8px;border-radius:13px!important;background:#fff!important;}
.phase6-bottom-tools{gap:10px!important;}
.phase6-device-btn{width:auto!important;min-width:86px!important;height:38px!important;padding:0 12px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;border-radius:13px!important;background:#fff!important;color:#0f1b2d!important;font-weight:900!important;font-size:13px!important;}
.phase6-device-btn:hover{background:#eef6ff!important;border-color:#a9ceff!important;color:#075ee5!important;}
.phase6-device-btn .phase6-svg-icon{width:16px!important;height:16px!important;}
.phase6-grid-toggle{height:38px;display:inline-flex;align-items:center;gap:8px;}
.phase6-layer-tools .phase6-icon-btn{cursor:pointer!important;}
.phase6-layer-tools .phase6-icon-btn:hover{background:#eaf4ff!important;border-color:#9cc7ff!important;color:#075ee5!important;}
.phase6-pro-add-panel.is-hidden{display:none!important;}
#p6CloseAddLayer{cursor:pointer!important;pointer-events:auto!important;}
#p6CloseAddLayer:hover{background:#eef6ff!important;color:#075ee5!important;}
.phase6-inspector-tabs button{pointer-events:auto!important;}
.phase6-inspector-tabs button:hover{color:#075ee5!important;}
.phase6-pro-panel.is-collapsed .phase6-pro-panel-title strong{font-size:13px!important;}
@media (min-width:1181px) and (max-width:1680px){
  #view-templates .phase6-pro-page{padding-right:4px;}
  .phase6-workspace{grid-template-columns:minmax(205px,224px) minmax(220px,240px) minmax(500px,1fr) minmax(220px,245px)!important;gap:10px!important;}
  .phase6-workspace.p6-setup-collapsed{grid-template-columns:54px minmax(220px,240px) minmax(500px,1fr) minmax(220px,245px)!important;}
  .phase6-workspace.p6-layers-collapsed{grid-template-columns:minmax(205px,224px) 54px minmax(500px,1fr) minmax(220px,245px)!important;}
  .phase6-workspace.p6-inspector-collapsed{grid-template-columns:minmax(205px,224px) minmax(220px,240px) minmax(500px,1fr) 54px!important;}
  .phase6-workspace.p6-setup-collapsed.p6-layers-collapsed{grid-template-columns:54px 54px minmax(520px,1fr) minmax(220px,245px)!important;}
  .phase6-workspace.p6-setup-collapsed.p6-inspector-collapsed{grid-template-columns:54px minmax(220px,240px) minmax(520px,1fr) 54px!important;}
  .phase6-workspace.p6-layers-collapsed.p6-inspector-collapsed{grid-template-columns:minmax(205px,224px) 54px minmax(520px,1fr) 54px!important;}
  .phase6-workspace.p6-setup-collapsed.p6-layers-collapsed.p6-inspector-collapsed{grid-template-columns:54px 54px minmax(520px,1fr) 54px!important;}
  .phase6-pro-panel{padding:10px!important;}
  .phase6-canvas-wrap{padding:16px!important;}
  .phase6-canvas-stage{min-width:560px!important;}
}
@media (max-width:1180px){
  .phase6-device-btn{min-width:82px!important;}
  .phase6-bottom-tools{flex-wrap:wrap;height:auto!important;padding:10px!important;}
}

/* v2.1.43 Template Design layer tools polish */
.phase6-pro-add-panel.is-hidden,
.phase6-layer-actions.is-hidden{display:none!important;}
.phase6-actions-menu{position:relative;display:grid;gap:8px;margin-top:8px;}
.phase6-actions-toggle{width:100%;height:44px!important;border-radius:15px!important;background:#fff!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:9px!important;font-weight:900!important;color:#0b72f0!important;border-color:#b9d7fb!important;}
.phase6-actions-toggle .phase6-svg-icon{width:17px!important;height:17px!important;}
.phase6-actions-menu .phase6-layer-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important;padding:10px!important;border:1px solid #d9e8f8;border-radius:16px;background:#fff;box-shadow:0 18px 34px rgba(14,75,125,.12);}
.phase6-actions-menu .phase6-layer-actions button{min-height:38px!important;border-radius:12px!important;padding:0 10px!important;font-size:12px!important;font-weight:850!important;justify-content:center!important;white-space:normal!important;line-height:1.15!important;}
.phase6-actions-menu .phase6-layer-actions button .phase6-svg-icon{width:15px!important;height:15px!important;}
#p6DeleteSelected{grid-column:1/-1;}
.phase6-wide-add{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;}
.phase6-wide-add .phase6-svg-icon{width:17px!important;height:17px!important;}
.phase6-eye{width:26px;height:26px;border-radius:10px;cursor:pointer;color:#0b72f0;transition:all .16s ease;}
.phase6-eye:hover{background:#eaf4ff;transform:scale(1.04);}
.phase6-layer-tools #p6LayerShowAllBtn.is-muted{opacity:.7;}
.phase6-info-box:empty{display:none!important;}
.phase6-pro-panel .phase6-info-box{margin:8px 0;}
@media (max-width:1180px){
  .phase6-actions-menu .phase6-layer-actions{grid-template-columns:1fr;}
}

/* v2.1.45 Template Design toggle dropdown behavior fix */
.phase6-pro-add-panel.is-hidden,
.phase6-add-panel.is-hidden,
.phase6-actions-menu .phase6-layer-actions.is-hidden,
#p6LayerActionsMenu.is-hidden{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
}
.phase6-actions-toggle[aria-expanded="true"],
.phase6-wide-add[aria-expanded="true"]{
  background:#eaf4ff!important;
  border-color:#0b72f0!important;
  color:#0759d1!important;
}
.phase6-actions-toggle[aria-expanded="true"] .phase6-svg-icon:last-child{
  transform:rotate(180deg);
}

/* v2.1.45 Template Design compact setup + layer action fit polish */
.phase6-settings-grid.compact-two{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
}
.phase6-settings-grid.compact-two label.full{grid-column:1/-1!important;}
.phase6-settings-grid.compact-two label:nth-child(n+4){display:none!important;}
.phase6-layers-panel .phase6-panel-body,
.phase6-actions-menu,
.phase6-actions-toggle,
.phase6-actions-menu .phase6-layer-actions,
.phase6-actions-menu .phase6-layer-actions button{
  box-sizing:border-box!important;
  max-width:100%!important;
}
.phase6-actions-menu{width:100%!important;margin:8px 0 0!important;overflow:hidden!important;}
.phase6-actions-toggle{width:100%!important;min-width:0!important;}
.phase6-actions-menu .phase6-layer-actions{
  width:100%!important;
  max-width:100%!important;
  margin:8px 0 0!important;
  overflow:hidden!important;
}
.phase6-actions-menu .phase6-layer-actions button{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  padding-left:7px!important;
  padding-right:7px!important;
}
.phase6-template-item{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:8px!important;
  width:100%!important;
  box-sizing:border-box!important;
}
.phase6-template-item > div:first-child{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:3px!important;
  line-height:1.2!important;
}
.phase6-template-item strong{
  display:block!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:normal!important;
  font-size:13px!important;
  line-height:1.25!important;
}
.phase6-template-item small{
  display:block!important;
  color:#64748b!important;
  font-size:11px!important;
  font-weight:800!important;
  line-height:1.2!important;
  margin-top:0!important;
}
.phase6-template-item .phase6-mini-actions{
  display:flex!important;
  flex-direction:column!important;
  gap:6px!important;
  align-items:flex-end!important;
}
.phase6-template-item .phase6-mini-actions button{
  min-width:52px!important;
  height:32px!important;
  padding:0 9px!important;
  border-radius:10px!important;
}
.phase6-editor-settings .phase6-settings-note:not(.small){display:none!important;}
@media (max-width:1500px){
  .phase6-actions-menu .phase6-layer-actions{grid-template-columns:1fr!important;}
  .phase6-actions-menu .phase6-layer-actions button{justify-content:center!important;}
}

/* v2.1.46 Template Design add-layer placement: custom layers now start near the top of the visible label canvas. */


/* v2.1.75 — Template Design dark mode safe polish */
body.theme-dark #view-templates,
.app-shell.dark #view-templates{
  --p6d-bg:#07131d;
  --p6d-panel:#0b1824;
  --p6d-panel-2:#0d1d2a;
  --p6d-field:#081723;
  --p6d-line:#27465b;
  --p6d-line-2:#1d3648;
  --p6d-text:#f3fbff;
  --p6d-muted:#9fb8ca;
  --p6d-accent:#8ddfff;
}
body.theme-dark #view-templates .phase6-pro-topbar h2,
body.theme-dark #view-templates .phase6-pro-topbar p,
body.theme-dark #view-templates .phase6-pro-panel-title,
body.theme-dark #view-templates .phase6-pro-panel-title strong,
body.theme-dark #view-templates .phase6-layer-subtitle,
body.theme-dark #view-templates .phase6-layer strong,
body.theme-dark #view-templates .phase6-template-item strong,
body.theme-dark #view-templates .phase6-inspector-section summary,
body.theme-dark #view-templates .phase6-badge,
.app-shell.dark #view-templates .phase6-pro-topbar h2,
.app-shell.dark #view-templates .phase6-pro-topbar p,
.app-shell.dark #view-templates .phase6-pro-panel-title,
.app-shell.dark #view-templates .phase6-pro-panel-title strong,
.app-shell.dark #view-templates .phase6-layer-subtitle,
.app-shell.dark #view-templates .phase6-layer strong,
.app-shell.dark #view-templates .phase6-template-item strong,
.app-shell.dark #view-templates .phase6-inspector-section summary,
.app-shell.dark #view-templates .phase6-badge{
  color:var(--p6d-text)!important;
}
body.theme-dark #view-templates .phase6-layer small,
body.theme-dark #view-templates .phase6-template-item small,
body.theme-dark #view-templates .phase6-help,
body.theme-dark #view-templates .phase6-empty,
body.theme-dark #view-templates .phase6-layer-group-title,
body.theme-dark #view-templates .phase6-settings-note,
body.theme-dark #view-templates .phase6-info-box,
.app-shell.dark #view-templates .phase6-layer small,
.app-shell.dark #view-templates .phase6-template-item small,
.app-shell.dark #view-templates .phase6-help,
.app-shell.dark #view-templates .phase6-empty,
.app-shell.dark #view-templates .phase6-layer-group-title,
.app-shell.dark #view-templates .phase6-settings-note,
.app-shell.dark #view-templates .phase6-info-box{
  color:var(--p6d-muted)!important;
}
body.theme-dark #view-templates .phase6-badge,
body.theme-dark #view-templates .phase6-pro-tab,
body.theme-dark #view-templates .phase6-pro-panel,
body.theme-dark #view-templates .phase6-canvas-panel,
body.theme-dark #view-templates .phase6-canvas-shell,
body.theme-dark #view-templates .phase6-layer,
body.theme-dark #view-templates .phase6-template-item,
body.theme-dark #view-templates .phase6-add-panel,
body.theme-dark #view-templates .phase6-layer-actions,
body.theme-dark #view-templates .phase6-actions-menu .phase6-layer-actions,
.app-shell.dark #view-templates .phase6-badge,
.app-shell.dark #view-templates .phase6-pro-tab,
.app-shell.dark #view-templates .phase6-pro-panel,
.app-shell.dark #view-templates .phase6-canvas-panel,
.app-shell.dark #view-templates .phase6-canvas-shell,
.app-shell.dark #view-templates .phase6-layer,
.app-shell.dark #view-templates .phase6-template-item,
.app-shell.dark #view-templates .phase6-add-panel,
.app-shell.dark #view-templates .phase6-layer-actions,
.app-shell.dark #view-templates .phase6-actions-menu .phase6-layer-actions{
  background:linear-gradient(180deg,var(--p6d-panel),var(--p6d-panel-2))!important;
  border-color:var(--p6d-line)!important;
  color:var(--p6d-text)!important;
  box-shadow:none!important;
}
body.theme-dark #view-templates .phase6-pro-tab.active,
.app-shell.dark #view-templates .phase6-pro-tab.active{
  background:#112638!important;
  border-color:#1d7dff!important;
  color:#8ccfff!important;
  box-shadow:inset 0 -2px 0 #1d7dff!important;
}
body.theme-dark #view-templates .phase6-toolbar-sep,
.app-shell.dark #view-templates .phase6-toolbar-sep{background:var(--p6d-line)!important;}
body.theme-dark #view-templates .phase6-head-icon,
.app-shell.dark #view-templates .phase6-head-icon{
  background:#0d2332!important;
  border-color:#2d617a!important;
  color:var(--p6d-accent)!important;
}
body.theme-dark #view-templates .phase6-collapse-btn,
body.theme-dark #view-templates .phase6-icon-btn,
body.theme-dark #view-templates .phase6-device-btn,
body.theme-dark #view-templates .phase6-grid-toggle,
body.theme-dark #view-templates .phase6-actions-toggle,
body.theme-dark #view-templates .phase6-settings-actions .ghost,
body.theme-dark #view-templates .phase6-pro-actionbar .ghost,
.app-shell.dark #view-templates .phase6-collapse-btn,
.app-shell.dark #view-templates .phase6-icon-btn,
.app-shell.dark #view-templates .phase6-device-btn,
.app-shell.dark #view-templates .phase6-grid-toggle,
.app-shell.dark #view-templates .phase6-actions-toggle,
.app-shell.dark #view-templates .phase6-settings-actions .ghost,
.app-shell.dark #view-templates .phase6-pro-actionbar .ghost{
  background:#0a1c2a!important;
  border-color:#2d617a!important;
  color:var(--p6d-text)!important;
  box-shadow:none!important;
}
body.theme-dark #view-templates .phase6-collapse-btn:hover,
body.theme-dark #view-templates .phase6-icon-btn:hover,
body.theme-dark #view-templates .phase6-device-btn:hover,
body.theme-dark #view-templates .phase6-actions-toggle:hover,
body.theme-dark #view-templates .phase6-settings-actions .ghost:hover,
body.theme-dark #view-templates .phase6-pro-actionbar .ghost:hover,
.app-shell.dark #view-templates .phase6-collapse-btn:hover,
.app-shell.dark #view-templates .phase6-icon-btn:hover,
.app-shell.dark #view-templates .phase6-device-btn:hover,
.app-shell.dark #view-templates .phase6-actions-toggle:hover,
.app-shell.dark #view-templates .phase6-settings-actions .ghost:hover,
.app-shell.dark #view-templates .phase6-pro-actionbar .ghost:hover{
  background:#0f2a3c!important;
  border-color:#3c7896!important;
  color:#fff!important;
}
body.theme-dark #view-templates input,
body.theme-dark #view-templates select,
body.theme-dark #view-templates textarea,
body.theme-dark #view-templates .phase6-layer-search,
body.theme-dark #view-templates .phase6-logo-tools input[type=file],
.app-shell.dark #view-templates input,
.app-shell.dark #view-templates select,
.app-shell.dark #view-templates textarea,
.app-shell.dark #view-templates .phase6-layer-search,
.app-shell.dark #view-templates .phase6-logo-tools input[type=file]{
  background:var(--p6d-field)!important;
  color:var(--p6d-text)!important;
  border-color:var(--p6d-line)!important;
  -webkit-text-fill-color:var(--p6d-text)!important;
  box-shadow:none!important;
}
body.theme-dark #view-templates input::placeholder,
body.theme-dark #view-templates textarea::placeholder,
.app-shell.dark #view-templates input::placeholder,
.app-shell.dark #view-templates textarea::placeholder{
  color:#87a6b9!important;
  -webkit-text-fill-color:#87a6b9!important;
  opacity:1!important;
}
body.theme-dark #view-templates label,
body.theme-dark #view-templates label > span,
body.theme-dark #view-templates .phase6-settings-grid label,
body.theme-dark #view-templates .phase6-inspector-grid label,
body.theme-dark #view-templates .phase6-inspector-settings label,
.app-shell.dark #view-templates label,
.app-shell.dark #view-templates label > span,
.app-shell.dark #view-templates .phase6-settings-grid label,
.app-shell.dark #view-templates .phase6-inspector-grid label,
.app-shell.dark #view-templates .phase6-inspector-settings label{
  color:var(--p6d-muted)!important;
}
body.theme-dark #view-templates .phase6-settings-note,
body.theme-dark #view-templates .phase6-info-box,
body.theme-dark #view-templates .phase6-map-status,
.app-shell.dark #view-templates .phase6-settings-note,
.app-shell.dark #view-templates .phase6-info-box,
.app-shell.dark #view-templates .phase6-map-status{
  background:#0a1c2a!important;
  border-color:#2d617a!important;
}
body.theme-dark #view-templates .phase6-map-status,
.app-shell.dark #view-templates .phase6-map-status{color:#9cffc8!important;}
body.theme-dark #view-templates .phase6-layer.active,
.app-shell.dark #view-templates .phase6-layer.active{
  background:#112638!important;
  border-color:#1d7dff!important;
  outline:2px solid #1d7dff!important;
}
body.theme-dark #view-templates .phase6-layer-group-title em,
.app-shell.dark #view-templates .phase6-layer-group-title em{background:#13354a!important;color:#8ddfff!important;}
body.theme-dark #view-templates .phase6-inspector-tabs,
.app-shell.dark #view-templates .phase6-inspector-tabs{background:#0a1c2a!important;border-color:#2d617a!important;}
body.theme-dark #view-templates .phase6-inspector-tabs button,
.app-shell.dark #view-templates .phase6-inspector-tabs button{background:#0a1c2a!important;color:var(--p6d-muted)!important;}
body.theme-dark #view-templates .phase6-inspector-tabs button.active,
.app-shell.dark #view-templates .phase6-inspector-tabs button.active{background:#103047!important;color:var(--p6d-accent)!important;box-shadow:inset 0 0 0 1px #1d7dff!important;}
body.theme-dark #view-templates .phase6-inspector-section,
.app-shell.dark #view-templates .phase6-inspector-section{border-top-color:var(--p6d-line-2)!important;}
body.theme-dark #view-templates .phase6-canvas-panel,
body.theme-dark #view-templates .phase6-canvas-shell,
body.theme-dark #view-templates .phase6-canvas-wrap,
body.theme-dark #view-templates .phase6-bottom-tools,
.app-shell.dark #view-templates .phase6-canvas-panel,
.app-shell.dark #view-templates .phase6-canvas-shell,
.app-shell.dark #view-templates .phase6-canvas-wrap,
.app-shell.dark #view-templates .phase6-bottom-tools{background:#0d1823!important;}
body.theme-dark #view-templates .phase6-ruler-x,
body.theme-dark #view-templates .phase6-ruler-y,
.app-shell.dark #view-templates .phase6-ruler-x,
.app-shell.dark #view-templates .phase6-ruler-y{background:#0d1823!important;border-color:var(--p6d-line)!important;color:#8eaabd!important;}
body.theme-dark #view-templates .phase6-canvas-stage,
.app-shell.dark #view-templates .phase6-canvas-stage{border-color:var(--p6d-line)!important;background-image:linear-gradient(to right, rgba(142,170,189,.12) 1px, transparent 1px),linear-gradient(to bottom, rgba(142,170,189,.12) 1px, transparent 1px)!important;}
body.theme-dark #view-templates .phase6-bottom-tools,
.app-shell.dark #view-templates .phase6-bottom-tools{border-top-color:var(--p6d-line)!important;}
body.theme-dark #view-templates .phase6-grid-toggle span,
.app-shell.dark #view-templates .phase6-grid-toggle span{color:var(--p6d-text)!important;}


/* v2.1.75 — Template Design final theme polish */
#view-templates .phase6-zoom.pro,
#view-templates .phase6-add-tile,
#view-templates .phase6-wide-add,
#view-templates .phase6-actions-menu .phase6-layer-actions,
#view-templates .phase6-actions-menu .phase6-layer-actions button,
#view-templates .phase6-logo-tools input[type=file]::file-selector-button,
#view-templates .phase6-logo-tools input[type=file]::-webkit-file-upload-button{
  transition:background .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease;
}
#view-templates .phase6-actions-menu .phase6-layer-actions button:disabled,
#view-templates .phase6-logo-tools input[type=file]:disabled,
#view-templates .phase6-logo-tools input[type=file]:disabled::file-selector-button,
#view-templates .phase6-logo-tools input[type=file]:disabled::-webkit-file-upload-button{
  opacity:1!important;
  cursor:not-allowed!important;
}
#view-templates .phase6-actions-menu .phase6-layer-actions button:disabled{
  background:#f7fbff!important;
  color:#8aa0b4!important;
  border-color:#dbe8f5!important;
}
#view-templates .phase6-zoom.pro strong{color:#5f7890!important;}
#view-templates .phase6-add-tile span{line-height:1.15;color:inherit;}
#view-templates .phase6-logo-tools input[type=file]{font-weight:700!important;}
#view-templates .phase6-logo-tools input[type=file]::file-selector-button,
#view-templates .phase6-logo-tools input[type=file]::-webkit-file-upload-button{
  border:1px solid #b9d8ff!important;
  border-radius:10px!important;
  background:#eaf4ff!important;
  color:#0b72f0!important;
  font-weight:900!important;
  padding:8px 12px!important;
  margin-right:10px!important;
  cursor:pointer!important;
}
body.theme-dark #view-templates .phase6-zoom.pro,
.app-shell.dark #view-templates .phase6-zoom.pro{
  background:linear-gradient(180deg,var(--p6d-panel),var(--p6d-panel-2))!important;
  border-color:var(--p6d-line)!important;
  box-shadow:none!important;
}
body.theme-dark #view-templates .phase6-zoom.pro strong,
.app-shell.dark #view-templates .phase6-zoom.pro strong{
  color:var(--p6d-text)!important;
}
body.theme-dark #view-templates .phase6-add-tile,
.app-shell.dark #view-templates .phase6-add-tile{
  background:linear-gradient(180deg,#0c2131,#0a1b29)!important;
  border-color:var(--p6d-line)!important;
  color:var(--p6d-text)!important;
  box-shadow:none!important;
}
body.theme-dark #view-templates .phase6-add-tile b,
body.theme-dark #view-templates .phase6-add-tile span,
.app-shell.dark #view-templates .phase6-add-tile b,
.app-shell.dark #view-templates .phase6-add-tile span{
  color:var(--p6d-text)!important;
}
body.theme-dark #view-templates .phase6-add-tile b .phase6-svg-icon,
.app-shell.dark #view-templates .phase6-add-tile b .phase6-svg-icon{
  color:var(--p6d-accent)!important;
}
body.theme-dark #view-templates .phase6-add-tile:hover,
.app-shell.dark #view-templates .phase6-add-tile:hover{
  background:linear-gradient(180deg,#0f2940,#0c2233)!important;
  border-color:#3b7a9b!important;
  box-shadow:0 10px 22px rgba(0,0,0,.22)!important;
}
body.theme-dark #view-templates .phase6-wide-add,
.app-shell.dark #view-templates .phase6-wide-add{
  background:#0f2a3c!important;
  border-color:#3c7896!important;
  color:#eef9ff!important;
}
body.theme-dark #view-templates .phase6-wide-add .phase6-svg-icon,
.app-shell.dark #view-templates .phase6-wide-add .phase6-svg-icon{
  color:#8ddfff!important;
}
body.theme-dark #view-templates .phase6-wide-add:hover,
body.theme-dark #view-templates .phase6-wide-add[aria-expanded="true"],
.app-shell.dark #view-templates .phase6-wide-add:hover,
.app-shell.dark #view-templates .phase6-wide-add[aria-expanded="true"]{
  background:#13354a!important;
  border-color:#56a6cf!important;
  color:#fff!important;
}
body.theme-dark #view-templates .phase6-logo-tools input[type=file],
.app-shell.dark #view-templates .phase6-logo-tools input[type=file]{
  background:#091a28!important;
  color:var(--p6d-text)!important;
  border-color:var(--p6d-line)!important;
}
body.theme-dark #view-templates .phase6-logo-tools input[type=file]::file-selector-button,
body.theme-dark #view-templates .phase6-logo-tools input[type=file]::-webkit-file-upload-button,
.app-shell.dark #view-templates .phase6-logo-tools input[type=file]::file-selector-button,
.app-shell.dark #view-templates .phase6-logo-tools input[type=file]::-webkit-file-upload-button{
  background:#103047!important;
  color:#eaf7ff!important;
  border:1px solid #3c7896!important;
  box-shadow:none!important;
}
body.theme-dark #view-templates .phase6-logo-tools input[type=file]:disabled::file-selector-button,
body.theme-dark #view-templates .phase6-logo-tools input[type=file]:disabled::-webkit-file-upload-button,
.app-shell.dark #view-templates .phase6-logo-tools input[type=file]:disabled::file-selector-button,
.app-shell.dark #view-templates .phase6-logo-tools input[type=file]:disabled::-webkit-file-upload-button{
  background:#203443!important;
  color:#8eaabd!important;
  border-color:#35566d!important;
}
body.theme-dark #view-templates .phase6-actions-menu .phase6-layer-actions,
.app-shell.dark #view-templates .phase6-actions-menu .phase6-layer-actions{
  background:linear-gradient(180deg,var(--p6d-panel),var(--p6d-panel-2))!important;
  border-color:var(--p6d-line)!important;
  box-shadow:none!important;
}
body.theme-dark #view-templates .phase6-actions-menu .phase6-layer-actions button,
.app-shell.dark #view-templates .phase6-actions-menu .phase6-layer-actions button{
  background:#0a1c2a!important;
  border-color:#2d617a!important;
  color:var(--p6d-text)!important;
}
body.theme-dark #view-templates .phase6-actions-menu .phase6-layer-actions button .phase6-svg-icon,
.app-shell.dark #view-templates .phase6-actions-menu .phase6-layer-actions button .phase6-svg-icon{
  color:inherit!important;
}
body.theme-dark #view-templates .phase6-actions-menu .phase6-layer-actions button:hover:not(:disabled),
.app-shell.dark #view-templates .phase6-actions-menu .phase6-layer-actions button:hover:not(:disabled){
  background:#0f2a3c!important;
  border-color:#3c7896!important;
  color:#fff!important;
}
body.theme-dark #view-templates .phase6-actions-menu .phase6-layer-actions button:disabled,
.app-shell.dark #view-templates .phase6-actions-menu .phase6-layer-actions button:disabled{
  background:#142633!important;
  border-color:#314c5f!important;
  color:#6f8da2!important;
}
body.theme-dark #view-templates .phase6-actions-menu .phase6-layer-actions .danger,
.app-shell.dark #view-templates .phase6-actions-menu .phase6-layer-actions .danger{
  color:#ff9bb8!important;
  border-color:#8b3b54!important;
}
body.theme-dark #view-templates .phase6-actions-menu .phase6-layer-actions .danger:hover:not(:disabled),
.app-shell.dark #view-templates .phase6-actions-menu .phase6-layer-actions .danger:hover:not(:disabled){
  background:rgba(217,107,135,.14)!important;
  border-color:#cf4b71!important;
  color:#ffd4df!important;
}

/* v2.1.126 — Final Page Header Match for Template, Users, and Security
   Loaded after all page-specific CSS so these three remaining headers match the Dashboard hero exactly. */
#view-templates .phase6-pro-topbar.kls-page-hero,
#view-users .users-pro-head.kls-page-hero,
#view-security .security-topbar.kls-page-hero{
  box-sizing:border-box!important;
  width:100%!important;
  min-height:108px!important;
  padding:20px 26px!important;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  border:1px solid color-mix(in srgb,var(--line,#d7e6f0) 92%,transparent)!important;
  border-radius:24px!important;
  background:linear-gradient(135deg,#ffffff 0%,#f8fcff 62%,#eff7ff 100%)!important;
  box-shadow:0 16px 42px rgba(12,42,72,.075), inset 0 1px 0 rgba(255,255,255,.86)!important;
  overflow:visible!important;
}
#view-templates.active,
#view-users.active,
#view-security.active{
  gap:22px!important;
}
#view-templates .phase6-pro-page{
  display:grid!important;
  gap:22px!important;
  width:100%!important;
  max-width:100%!important;
}
#view-templates .phase6-pro-topbar{margin-bottom:0!important;align-items:center!important;}
#view-templates .phase6-page-title-wrap{
  display:flex!important;
  align-items:center!important;
  gap:16px!important;
  min-width:0!important;
}
#view-templates .phase6-page-title-icon{
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  border-radius:18px!important;
  display:grid!important;
  place-items:center!important;
  background:linear-gradient(180deg,#f7fbff,#eff7ff)!important;
  border:1px solid #cfe2f4!important;
  color:#0e8ceb!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
}
#view-templates .phase6-page-title-icon .phase6-svg-icon{
  width:22px!important;
  height:22px!important;
  stroke:currentColor!important;
  fill:none!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
#view-templates .phase6-pro-topbar h2,
#view-users .users-pro-head h2,
#view-security .security-topbar h2{
  margin:0 0 7px!important;
  color:#071c34!important;
  font-size:28px!important;
  line-height:1.08!important;
  font-weight:800!important;
  letter-spacing:-.035em!important;
}
#view-templates .phase6-pro-topbar p,
#view-users .users-pro-head p,
#view-security .security-topbar p{
  margin:0!important;
  color:#60758e!important;
  font-size:15px!important;
  line-height:1.45!important;
  font-weight:500!important;
  letter-spacing:0!important;
  text-transform:none!important;
}
#view-users .users-pro-head > div:first-child,
#view-security .security-topbar > div:first-child{
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  min-height:56px!important;
  padding-inline-start:72px!important;
  min-width:0!important;
}
#view-users .users-pro-head > div:first-child::before,
#view-security .security-topbar > div:first-child::before{
  content:""!important;
  position:absolute!important;
  inset-inline-start:0!important;
  top:50%!important;
  width:56px!important;
  height:56px!important;
  transform:translateY(-50%)!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#f7fbff,#eff7ff)!important;
  border:1px solid #cfe2f4!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
}
#view-users .users-pro-head > div:first-child::after,
#view-security .security-topbar > div:first-child::after{
  content:""!important;
  position:absolute!important;
  inset-inline-start:17px!important;
  top:50%!important;
  width:22px!important;
  height:22px!important;
  transform:translateY(-50%)!important;
  background:#0e8ceb!important;
  -webkit-mask:var(--kls-title-mask) center/22px 22px no-repeat!important;
  mask:var(--kls-title-mask) center/22px 22px no-repeat!important;
}
#view-users .users-pro-head > div:first-child{
  --kls-title-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 11a4 4 0 1 0-8 0 4 4 0 0 0 8 0Z'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3Cpath d='M18 8a3 3 0 0 1 0 6'/%3E%3C/svg%3E");
}
#view-security .security-topbar > div:first-child{
  --kls-title-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 5 6v6c0 4 3 7 7 9 4-2 7-5 7-9V6l-7-3Z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}
#view-users .users-pro-actions,
#view-security .button-wrap.compact{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:12px!important;
  flex-wrap:nowrap!important;
  align-self:center!important;
  min-width:0!important;
}
#view-users .users-pro-actions .users-search-field{
  min-height:46px!important;
  height:46px!important;
  border:1px solid #cfdfed!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.86)!important;
  box-shadow:none!important;
  min-width:260px!important;
}
#view-users .users-pro-actions button,
#view-security .security-refresh-btn{
  min-height:46px!important;
  height:46px!important;
  border-radius:16px!important;
  padding:0 18px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:9px!important;
  font-size:14px!important;
  font-weight:800!important;
  line-height:1!important;
  letter-spacing:-.01em!important;
  white-space:nowrap!important;
  box-shadow:none!important;
}
#view-users .users-primary-action{
  background:linear-gradient(135deg,#13b8e7 0%,#087cf4 100%)!important;
  color:#fff!important;
  border:1px solid rgba(7,124,244,.18)!important;
  box-shadow:0 14px 28px rgba(8,124,244,.18)!important;
}
#view-users .users-filter-btn,
#view-security .security-refresh-btn{
  background:rgba(255,255,255,.86)!important;
  color:#0f2033!important;
  border:1px solid #cfdfed!important;
}
body.theme-dark #view-templates .phase6-pro-topbar.kls-page-hero,
body.theme-dark #view-users .users-pro-head.kls-page-hero,
body.theme-dark #view-security .security-topbar.kls-page-hero,
.app-shell.dark #view-templates .phase6-pro-topbar.kls-page-hero,
.app-shell.dark #view-users .users-pro-head.kls-page-hero,
.app-shell.dark #view-security .security-topbar.kls-page-hero{
  background:linear-gradient(135deg,#0d1a27 0%,#0a1724 58%,#07121d 100%)!important;
  border-color:#20384c!important;
  box-shadow:0 18px 48px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.04)!important;
}
body.theme-dark #view-templates .phase6-page-title-icon,
body.theme-dark #view-users .users-pro-head > div:first-child::before,
body.theme-dark #view-security .security-topbar > div:first-child::before,
.app-shell.dark #view-templates .phase6-page-title-icon,
.app-shell.dark #view-users .users-pro-head > div:first-child::before,
.app-shell.dark #view-security .security-topbar > div:first-child::before{
  background:#0b2032!important;
  border-color:#254866!important;
  color:#35b7ff!important;
}
body.theme-dark #view-users .users-pro-head > div:first-child::after,
body.theme-dark #view-security .security-topbar > div:first-child::after,
.app-shell.dark #view-users .users-pro-head > div:first-child::after,
.app-shell.dark #view-security .security-topbar > div:first-child::after{background:#35b7ff!important;}
body.theme-dark #view-templates .phase6-pro-topbar h2,
body.theme-dark #view-users .users-pro-head h2,
body.theme-dark #view-security .security-topbar h2,
.app-shell.dark #view-templates .phase6-pro-topbar h2,
.app-shell.dark #view-users .users-pro-head h2,
.app-shell.dark #view-security .security-topbar h2{color:#f5fbff!important;}
body.theme-dark #view-templates .phase6-pro-topbar p,
body.theme-dark #view-users .users-pro-head p,
body.theme-dark #view-security .security-topbar p,
.app-shell.dark #view-templates .phase6-pro-topbar p,
.app-shell.dark #view-users .users-pro-head p,
.app-shell.dark #view-security .security-topbar p{color:#9fb5c5!important;}
body.theme-dark #view-users .users-search-field,
body.theme-dark #view-users .users-filter-btn,
body.theme-dark #view-security .security-refresh-btn,
.app-shell.dark #view-users .users-search-field,
.app-shell.dark #view-users .users-filter-btn,
.app-shell.dark #view-security .security-refresh-btn{
  background:#0b1724!important;
  border-color:#28465d!important;
  color:#eaf4ff!important;
}
@media (max-width:900px){
  #view-templates.active,#view-users.active,#view-security.active,
  #view-templates .phase6-pro-page{gap:16px!important;}
  #view-templates .phase6-pro-topbar.kls-page-hero,
  #view-users .users-pro-head.kls-page-hero,
  #view-security .security-topbar.kls-page-hero{
    min-height:0!important;
    padding:16px!important;
    border-radius:22px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:14px!important;
  }
  #view-templates .phase6-page-title-wrap{gap:12px!important;}
  #view-templates .phase6-page-title-icon,
  #view-users .users-pro-head > div:first-child::before,
  #view-security .security-topbar > div:first-child::before{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    border-radius:15px!important;
  }
  #view-users .users-pro-head > div:first-child,
  #view-security .security-topbar > div:first-child{
    min-height:46px!important;
    padding-inline-start:58px!important;
  }
  #view-users .users-pro-head > div:first-child::after,
  #view-security .security-topbar > div:first-child::after{
    inset-inline-start:13px!important;
    width:20px!important;
    height:20px!important;
    -webkit-mask-size:20px 20px!important;
    mask-size:20px 20px!important;
  }
  #view-templates .phase6-pro-topbar h2,
  #view-users .users-pro-head h2,
  #view-security .security-topbar h2{font-size:22px!important;margin-bottom:5px!important;}
  #view-templates .phase6-pro-topbar p,
  #view-users .users-pro-head p,
  #view-security .security-topbar p{font-size:13px!important;line-height:1.38!important;}
  #view-users .users-pro-actions,
  #view-security .button-wrap.compact{
    width:100%!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    justify-content:stretch!important;
  }
  #view-users .users-pro-actions .users-search-field,
  #view-users .users-pro-actions button,
  #view-security .security-refresh-btn{width:100%!important;min-width:0!important;}
}
html[dir="rtl"] #view-users .users-pro-head > div:first-child,
html[dir="rtl"] #view-security .security-topbar > div:first-child{
  padding-inline-start:0!important;
  padding-inline-end:72px!important;
}
html[dir="rtl"] #view-users .users-pro-head > div:first-child::before,
html[dir="rtl"] #view-security .security-topbar > div:first-child::before{
  inset-inline-start:auto!important;
  inset-inline-end:0!important;
}
html[dir="rtl"] #view-users .users-pro-head > div:first-child::after,
html[dir="rtl"] #view-security .security-topbar > div:first-child::after{
  inset-inline-start:auto!important;
  inset-inline-end:17px!important;
}
@media (max-width:900px){
  html[dir="rtl"] #view-users .users-pro-head > div:first-child,
  html[dir="rtl"] #view-security .security-topbar > div:first-child{padding-inline-end:58px!important;}
  html[dir="rtl"] #view-users .users-pro-head > div:first-child::after,
  html[dir="rtl"] #view-security .security-topbar > div:first-child::after{inset-inline-end:13px!important;}
}

/* v2.1.131 — Template Designer Mobile Collapse Arrow Direction + Alignment Polish */
@media (max-width:760px){
  #view-templates .phase6-workspace,
  #view-templates .phase6-workspace.p6-setup-collapsed,
  #view-templates .phase6-workspace.p6-layers-collapsed,
  #view-templates .phase6-workspace.p6-inspector-collapsed,
  #view-templates .phase6-workspace.p6-setup-collapsed.p6-layers-collapsed,
  #view-templates .phase6-workspace.p6-setup-collapsed.p6-inspector-collapsed,
  #view-templates .phase6-workspace.p6-layers-collapsed.p6-inspector-collapsed,
  #view-templates .phase6-workspace.p6-setup-collapsed.p6-layers-collapsed.p6-inspector-collapsed{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  #view-templates .phase6-pro-panel,
  #view-templates .phase6-pro-panel.is-collapsed{
    width:100%!important;
    min-height:auto!important;
    padding:10px!important;
    border-radius:16px!important;
  }
  #view-templates .phase6-pro-panel .phase6-pro-panel-head,
  #view-templates .phase6-pro-panel.is-collapsed .phase6-pro-panel-head{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    height:auto!important;
    min-height:38px!important;
    margin:0!important;
    width:100%!important;
  }
  #view-templates .phase6-pro-panel:not(.is-collapsed) .phase6-pro-panel-head{
    margin-bottom:10px!important;
  }
  #view-templates .phase6-pro-panel .phase6-pro-panel-title,
  #view-templates .phase6-pro-panel.is-collapsed .phase6-pro-panel-title{
    flex:1 1 auto!important;
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
    gap:9px!important;
    writing-mode:initial!important;
    transform:none!important;
    margin:0!important;
    font-size:13px!important;
    text-align:left!important;
  }
  #view-templates .phase6-pro-panel .phase6-pro-panel-title strong,
  #view-templates .phase6-pro-panel.is-collapsed .phase6-pro-panel-title strong{
    display:block!important;
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:13px!important;
  }
  #view-templates .phase6-pro-panel .phase6-head-icon,
  #view-templates .phase6-pro-panel.is-collapsed .phase6-head-icon{
    width:28px!important;
    height:28px!important;
    margin:0!important;
    flex:0 0 28px!important;
  }
  #view-templates .phase6-pro-panel .phase6-collapse-btn,
  #view-templates .phase6-pro-panel.is-collapsed .phase6-collapse-btn{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    flex:0 0 34px!important;
    margin:0 0 0 auto!important;
    display:grid!important;
    place-items:center!important;
    transform:none!important;
    border-radius:12px!important;
  }
  #view-templates .phase6-pro-panel .phase6-collapse-btn:hover,
  #view-templates .phase6-pro-panel.is-collapsed .phase6-collapse-btn:hover{
    transform:none!important;
  }
  /* On mobile the panel opens/closes vertically, so the arrow must be up/down instead of left/right. */
  #view-templates .phase6-pro-panel .phase6-collapse-btn .phase6-svg-icon{
    width:16px!important;
    height:16px!important;
    transform:rotate(90deg)!important; /* expanded = up */
    transition:transform .18s ease!important;
  }
  #view-templates .phase6-pro-panel.is-collapsed .phase6-collapse-btn .phase6-svg-icon{
    transform:rotate(-90deg)!important; /* collapsed = down */
  }
  html[dir="rtl"] #view-templates .phase6-pro-panel .phase6-collapse-btn,
  html[dir="rtl"] #view-templates .phase6-pro-panel.is-collapsed .phase6-collapse-btn{
    margin-left:0!important;
    margin-right:auto!important;
  }
}


/* v2.1.173 — Template Designer Lock Button Contrast Repair */
#view-templates .phase6-lock-btn,
#view-templates #p6InspectorLock{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  color:#0b72f0!important;
  -webkit-text-fill-color:#0b72f0!important;
  background:#f7fbff!important;
  border:1px solid #cfe2f2!important;
  font-weight:850!important;
  opacity:1!important;
  visibility:visible!important;
}
#view-templates .phase6-lock-btn .phase6-svg-icon,
#view-templates #p6InspectorLock .phase6-svg-icon,
#view-templates .phase6-lock-btn svg,
#view-templates #p6InspectorLock svg{
  color:inherit!important;
  stroke:currentColor!important;
  opacity:1!important;
}
body.theme-dark #view-templates .phase6-lock-btn,
body.theme-dark #view-templates #p6InspectorLock,
.app-shell.dark #view-templates .phase6-lock-btn,
.app-shell.dark #view-templates #p6InspectorLock{
  color:#eaf7ff!important;
  -webkit-text-fill-color:#eaf7ff!important;
  background:#0e2537!important;
  border-color:#315a76!important;
  box-shadow:none!important;
}
body.theme-dark #view-templates .phase6-lock-btn:hover,
body.theme-dark #view-templates #p6InspectorLock:hover,
.app-shell.dark #view-templates .phase6-lock-btn:hover,
.app-shell.dark #view-templates #p6InspectorLock:hover{
  background:#12324b!important;
  border-color:#3e7192!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
}

/* v2.1.173 — Template Designer Lock/Unlock Button Final Contrast */
#view-templates .phase6-lock-btn,
#view-templates #p6InspectorLock,
#view-templates #p6ToggleLock{
  color:#0a5fc8!important;
  -webkit-text-fill-color:#0a5fc8!important;
  background:#ffffff!important;
  border:1px solid #bfd8ea!important;
  opacity:1!important;
  text-shadow:none!important;
}
#view-templates .phase6-lock-btn *,
#view-templates #p6InspectorLock *,
#view-templates #p6ToggleLock *{
  color:inherit!important;
  -webkit-text-fill-color:inherit!important;
  stroke:currentColor!important;
  opacity:1!important;
}
#view-templates .phase6-lock-btn:hover,
#view-templates #p6InspectorLock:hover,
#view-templates #p6ToggleLock:hover{
  background:#e9f5ff!important;
  border-color:#81bff0!important;
  color:#074da7!important;
  -webkit-text-fill-color:#074da7!important;
}
body.theme-dark #view-templates .phase6-lock-btn,
body.theme-dark #view-templates #p6InspectorLock,
body.theme-dark #view-templates #p6ToggleLock,
.app-shell.dark #view-templates .phase6-lock-btn,
.app-shell.dark #view-templates #p6InspectorLock,
.app-shell.dark #view-templates #p6ToggleLock{
  color:#eaf8ff!important;
  -webkit-text-fill-color:#eaf8ff!important;
  background:#0c2436!important;
  border-color:#315a76!important;
  opacity:1!important;
}
body.theme-dark #view-templates .phase6-lock-btn *,
body.theme-dark #view-templates #p6InspectorLock *,
body.theme-dark #view-templates #p6ToggleLock *,
.app-shell.dark #view-templates .phase6-lock-btn *,
.app-shell.dark #view-templates #p6InspectorLock *,
.app-shell.dark #view-templates #p6ToggleLock *{
  color:inherit!important;
  -webkit-text-fill-color:inherit!important;
  stroke:currentColor!important;
  opacity:1!important;
}
body.theme-dark #view-templates .phase6-lock-btn:hover,
body.theme-dark #view-templates #p6InspectorLock:hover,
body.theme-dark #view-templates #p6ToggleLock:hover,
.app-shell.dark #view-templates .phase6-lock-btn:hover,
.app-shell.dark #view-templates #p6InspectorLock:hover,
.app-shell.dark #view-templates #p6ToggleLock:hover{
  background:#12324b!important;
  border-color:#4a7d9d!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
}

/* v2.1.173 — lock/unlock contrast follow-up */
#app.app-shell #view-templates :is(.lock-btn,.unlock-btn,[data-action="toggle-lock"],#layerLockBtn){color:#172b42!important;-webkit-text-fill-color:#172b42!important;}
body.theme-dark #app.app-shell #view-templates :is(.lock-btn,.unlock-btn,[data-action="toggle-lock"],#layerLockBtn),#app.app-shell.dark #view-templates :is(.lock-btn,.unlock-btn,[data-action="toggle-lock"],#layerLockBtn){background:#f8fbff!important;border-color:#d7e7f3!important;color:#071827!important;-webkit-text-fill-color:#071827!important;}
/* v2.1.173 — Template Designer Zoom Control Containment Fix
   Scope: Template Design zoom toolbar only. Keeps the global button style unchanged elsewhere. */
#app.app-shell #view-templates .phase6-pro-actionbar .phase6-zoom.pro{
  flex:0 0 310px!important;
  width:310px!important;
  max-width:310px!important;
  min-width:310px!important;
  height:46px!important;
  min-height:46px!important;
  max-height:46px!important;
  padding:4px 7px!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:34px minmax(108px,1fr) 52px 34px!important;
  align-items:center!important;
  justify-items:stretch!important;
  gap:8px!important;
  overflow:hidden!important;
}
#app.app-shell #view-templates .phase6-pro-actionbar .phase6-zoom.pro > button.ghost#p6ZoomMinus,
#app.app-shell #view-templates .phase6-pro-actionbar .phase6-zoom.pro > button.ghost#p6ZoomPlus{
  width:34px!important;
  min-width:34px!important;
  max-width:34px!important;
  height:34px!important;
  min-height:34px!important;
  max-height:34px!important;
  padding:0!important;
  margin:0!important;
  border-radius:11px!important;
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 34px!important;
  line-height:1!important;
  font-size:16px!important;
  font-weight:800!important;
  box-shadow:none!important;
  transform:none!important;
  background:#ffffff!important;
  background-image:none!important;
  border:1px solid #dbe8f5!important;
  color:#2f5a73!important;
  -webkit-text-fill-color:#2f5a73!important;
}
#app.app-shell #view-templates .phase6-pro-actionbar .phase6-zoom.pro > button.ghost#p6ZoomMinus:hover,
#app.app-shell #view-templates .phase6-pro-actionbar .phase6-zoom.pro > button.ghost#p6ZoomPlus:hover{
  transform:none!important;
  background:#eef8ff!important;
  border-color:#b9d8ff!important;
  color:#0b72f0!important;
  -webkit-text-fill-color:#0b72f0!important;
}
#app.app-shell #view-templates .phase6-pro-actionbar .phase6-zoom.pro > input#p6Zoom{
  width:100%!important;
  min-width:0!important;
  height:4px!important;
  min-height:4px!important;
  max-height:4px!important;
  padding:0!important;
  margin:0!important;
  align-self:center!important;
  box-shadow:none!important;
}
#app.app-shell #view-templates .phase6-pro-actionbar .phase6-zoom.pro > strong#p6ZoomValue{
  min-width:52px!important;
  width:52px!important;
  max-width:52px!important;
  text-align:center!important;
  line-height:1!important;
  white-space:nowrap!important;
  display:block!important;
  align-self:center!important;
}
body.theme-dark #app.app-shell #view-templates .phase6-pro-actionbar .phase6-zoom.pro > button.ghost#p6ZoomMinus,
body.theme-dark #app.app-shell #view-templates .phase6-pro-actionbar .phase6-zoom.pro > button.ghost#p6ZoomPlus,
#app.app-shell.dark #view-templates .phase6-pro-actionbar .phase6-zoom.pro > button.ghost#p6ZoomMinus,
#app.app-shell.dark #view-templates .phase6-pro-actionbar .phase6-zoom.pro > button.ghost#p6ZoomPlus{
  background:#071a28!important;
  background-image:none!important;
  border-color:#31576f!important;
  color:#eaf7ff!important;
  -webkit-text-fill-color:#eaf7ff!important;
  box-shadow:none!important;
}
body.theme-dark #app.app-shell #view-templates .phase6-pro-actionbar .phase6-zoom.pro > button.ghost#p6ZoomMinus:hover,
body.theme-dark #app.app-shell #view-templates .phase6-pro-actionbar .phase6-zoom.pro > button.ghost#p6ZoomPlus:hover,
#app.app-shell.dark #view-templates .phase6-pro-actionbar .phase6-zoom.pro > button.ghost#p6ZoomMinus:hover,
#app.app-shell.dark #view-templates .phase6-pro-actionbar .phase6-zoom.pro > button.ghost#p6ZoomPlus:hover{
  background:#0e2b40!important;
  border-color:#4aaee8!important;
  color:#dff8ff!important;
  -webkit-text-fill-color:#dff8ff!important;
  transform:none!important;
}
@media(max-width:760px){
  #app.app-shell #view-templates .phase6-pro-actionbar .phase6-zoom.pro{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    flex:1 1 100%!important;
    grid-template-columns:34px minmax(90px,1fr) 52px 34px!important;
  }
}
/* v2.1.176 — Template Designer Fullscreen Button Function Fix
   Scope: Template Design fullscreen canvas button only. */
body.phase6-template-fullscreen-active{overflow:hidden!important;}
#view-templates #p6CanvasPanel.phase6-fullscreen-canvas{
  position:fixed!important;
  z-index:2147483000!important;
  inset:12px!important;
  width:auto!important;
  max-width:none!important;
  height:auto!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  box-shadow:0 28px 80px rgba(15,40,75,.22)!important;
}
#view-templates #p6CanvasPanel.phase6-fullscreen-canvas .phase6-canvas-shell{flex:1 1 auto!important;min-height:0!important;display:flex!important;flex-direction:column!important;}
#view-templates #p6CanvasPanel.phase6-fullscreen-canvas .phase6-ruler-x{flex:0 0 34px!important;}
#view-templates #p6CanvasPanel.phase6-fullscreen-canvas .phase6-ruler-y{bottom:54px!important;}
#view-templates #p6CanvasPanel.phase6-fullscreen-canvas .phase6-canvas-wrap{flex:1 1 auto!important;height:auto!important;min-height:0!important;max-height:none!important;}
#view-templates #p6CanvasPanel.phase6-fullscreen-canvas .phase6-bottom-tools{flex:0 0 54px!important;}
#view-templates #p6FullscreenBtn.active{box-shadow:0 0 0 2px rgba(11,114,240,.18) inset!important;}
@supports (padding:max(0px)){
  #view-templates #p6CanvasPanel.phase6-fullscreen-canvas{inset:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))!important;}
}


/* V3.0.19 — Users & Permissions title icon TRUE RTL/LTR physical placement fix
   Rebuilt from V3.0.11. This fixes the old pseudo-icon conflict by using final
   physical left/right rules only, so the icon becomes leading in both directions:
   LTR = left of title, RTL = right of title. */
#view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child{
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  min-height:56px!important;
  min-width:0!important;
}
#view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child::before,
#view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child::after{
  position:absolute!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  content:""!important;
}
#view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child h2,
#view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child p{
  text-align:inherit!important;
}
html[dir="ltr"] #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child,
body.kls-ltr #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child,
#view-users.users-pro-view[dir="ltr"] .users-pro-head.kls-page-hero > div:first-child{
  direction:ltr!important;
  text-align:left!important;
  padding-left:72px!important;
  padding-right:0!important;
  padding-inline-start:0!important;
  padding-inline-end:0!important;
}
html[dir="ltr"] #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child::before,
body.kls-ltr #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child::before,
#view-users.users-pro-view[dir="ltr"] .users-pro-head.kls-page-hero > div:first-child::before{
  inset-inline-start:auto!important;
  inset-inline-end:auto!important;
  right:auto!important;
  left:0!important;
}
html[dir="ltr"] #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child::after,
body.kls-ltr #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child::after,
#view-users.users-pro-view[dir="ltr"] .users-pro-head.kls-page-hero > div:first-child::after{
  inset-inline-start:auto!important;
  inset-inline-end:auto!important;
  right:auto!important;
  left:17px!important;
}
html[dir="rtl"] #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child,
body.kls-rtl #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child,
#view-users.users-pro-view[dir="rtl"] .users-pro-head.kls-page-hero > div:first-child{
  direction:rtl!important;
  text-align:right!important;
  padding-right:72px!important;
  padding-left:0!important;
  padding-inline-start:0!important;
  padding-inline-end:0!important;
}
html[dir="rtl"] #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child::before,
body.kls-rtl #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child::before,
#view-users.users-pro-view[dir="rtl"] .users-pro-head.kls-page-hero > div:first-child::before{
  inset-inline-start:auto!important;
  inset-inline-end:auto!important;
  left:auto!important;
  right:0!important;
}
html[dir="rtl"] #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child::after,
body.kls-rtl #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child::after,
#view-users.users-pro-view[dir="rtl"] .users-pro-head.kls-page-hero > div:first-child::after{
  inset-inline-start:auto!important;
  inset-inline-end:auto!important;
  left:auto!important;
  right:17px!important;
}
@media (max-width:900px){
  html[dir="ltr"] #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child,
  body.kls-ltr #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child,
  #view-users.users-pro-view[dir="ltr"] .users-pro-head.kls-page-hero > div:first-child{
    padding-left:58px!important;
    padding-right:0!important;
  }
  html[dir="ltr"] #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child::after,
  body.kls-ltr #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child::after,
  #view-users.users-pro-view[dir="ltr"] .users-pro-head.kls-page-hero > div:first-child::after{
    left:13px!important;
    right:auto!important;
  }
  html[dir="rtl"] #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child,
  body.kls-rtl #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child,
  #view-users.users-pro-view[dir="rtl"] .users-pro-head.kls-page-hero > div:first-child{
    padding-right:58px!important;
    padding-left:0!important;
  }
  html[dir="rtl"] #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child::after,
  body.kls-rtl #view-users.users-pro-view .users-pro-head.kls-page-hero > div:first-child::after,
  #view-users.users-pro-view[dir="rtl"] .users-pro-head.kls-page-hero > div:first-child::after{
    right:13px!important;
    left:auto!important;
  }
}

/* V3.0.19 — Users & Permissions real title icon spacing fix
   Scope: Users & Permissions header only. Replaces the old pseudo-positioned icon with
   a real flex icon so text can never overlap it in English/LTR or Kurdish/Arabic RTL. */
#view-users.users-pro-view .users-pro-head.kls-page-hero > .users-page-title-wrap{
  position:relative!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:16px!important;
  min-height:56px!important;
  min-width:0!important;
  max-width:100%!important;
  flex:1 1 auto!important;
  padding:0!important;
  padding-left:0!important;
  padding-right:0!important;
  padding-inline-start:0!important;
  padding-inline-end:0!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
  text-align:start!important;
}
#view-users.users-pro-view .users-pro-head.kls-page-hero > .users-page-title-wrap::before,
#view-users.users-pro-view .users-pro-head.kls-page-hero > .users-page-title-wrap::after{
  content:none!important;
  display:none!important;
  position:static!important;
  width:0!important;
  height:0!important;
  background:none!important;
  border:0!important;
  box-shadow:none!important;
  transform:none!important;
  -webkit-mask:none!important;
  mask:none!important;
}
#view-users.users-pro-view .users-page-title-icon{
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  flex:0 0 56px!important;
  border-radius:18px!important;
  display:grid!important;
  place-items:center!important;
  background:linear-gradient(180deg,#f7fbff,#eff7ff)!important;
  border:1px solid #cfe2f4!important;
  color:#0e8ceb!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
}
#view-users.users-pro-view .users-page-title-icon svg{
  width:22px!important;
  height:22px!important;
  stroke:currentColor!important;
  fill:none!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
#view-users.users-pro-view .users-page-title-text{
  display:block!important;
  min-width:0!important;
  max-width:100%!important;
  flex:0 1 auto!important;
}
#view-users.users-pro-view .users-page-title-text h2,
#view-users.users-pro-view .users-page-title-text p{
  position:relative!important;
  z-index:1!important;
  max-width:100%!important;
  padding:0!important;
  padding-left:0!important;
  padding-right:0!important;
  padding-inline-start:0!important;
  padding-inline-end:0!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  text-align:inherit!important;
}
html[dir="ltr"] #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-page-title-wrap,
body.kls-ltr #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-page-title-wrap,
#view-users.users-pro-view[dir="ltr"] .users-pro-head.kls-page-hero > .users-page-title-wrap{
  direction:ltr!important;
  text-align:left!important;
}
html[dir="rtl"] #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-page-title-wrap,
body.kls-rtl #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-page-title-wrap,
#view-users.users-pro-view[dir="rtl"] .users-pro-head.kls-page-hero > .users-page-title-wrap{
  direction:rtl!important;
  text-align:right!important;
}
html[dir="ltr"] #view-users.users-pro-view .users-page-title-text,
body.kls-ltr #view-users.users-pro-view .users-page-title-text,
#view-users.users-pro-view[dir="ltr"] .users-page-title-text{
  direction:ltr!important;
  text-align:left!important;
}
html[dir="rtl"] #view-users.users-pro-view .users-page-title-text,
body.kls-rtl #view-users.users-pro-view .users-page-title-text,
#view-users.users-pro-view[dir="rtl"] .users-page-title-text{
  direction:rtl!important;
  text-align:right!important;
}
body.theme-dark #view-users.users-pro-view .users-page-title-icon,
.app-shell.dark #view-users.users-pro-view .users-page-title-icon{
  background:#0b2032!important;
  border-color:#254866!important;
  color:#35b7ff!important;
  box-shadow:none!important;
}
@media(max-width:900px){
  #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-page-title-wrap{
    min-height:46px!important;
    gap:12px!important;
    padding:0!important;
    padding-left:0!important;
    padding-right:0!important;
    padding-inline-start:0!important;
    padding-inline-end:0!important;
  }
  #view-users.users-pro-view .users-page-title-icon{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    flex-basis:46px!important;
    border-radius:15px!important;
  }
  #view-users.users-pro-view .users-page-title-icon svg{
    width:20px!important;
    height:20px!important;
  }
}


/* V3.0.20 — Users & Permissions hero title/header 100% match dashboard sample
   Scope: ONLY Users & Permissions page hero. Final override loaded after old pseudo-icon rules.
   Goal: same layout as Dashboard: LTR icon-left/text-right, RTL icon-right/text-left, with clean gap. */
html body #view-users.users-pro-view .users-pro-head.kls-page-hero{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  min-height:108px!important;
  padding:20px 26px!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html[dir="ltr"] body #view-users.users-pro-view .users-pro-head.kls-page-hero,
body.kls-ltr #view-users.users-pro-view .users-pro-head.kls-page-hero,
#view-users.users-pro-view[dir="ltr"] .users-pro-head.kls-page-hero{
  direction:ltr!important;
  flex-direction:row!important;
}
html[dir="rtl"] body #view-users.users-pro-view .users-pro-head.kls-page-hero,
body.kls-rtl #view-users.users-pro-view .users-pro-head.kls-page-hero,
#view-users.users-pro-view[dir="rtl"] .users-pro-head.kls-page-hero{
  direction:rtl!important;
  flex-direction:row!important;
}

/* Stronger than the older > div:first-child rules, so the title is not stacked or padded incorrectly. */
html body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child{
  position:relative!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:16px!important;
  min-height:56px!important;
  height:auto!important;
  min-width:0!important;
  max-width:100%!important;
  flex:1 1 auto!important;
  padding:0!important;
  padding-left:0!important;
  padding-right:0!important;
  padding-inline-start:0!important;
  padding-inline-end:0!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  transform:none!important;
}
html body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child::before,
html body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child::after{
  content:none!important;
  display:none!important;
  position:static!important;
  inset:auto!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  width:0!important;
  height:0!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  background:none!important;
  border:0!important;
  box-shadow:none!important;
  opacity:0!important;
  transform:none!important;
  -webkit-mask:none!important;
  mask:none!important;
}
html[dir="ltr"] body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child,
body.kls-ltr #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child,
#view-users.users-pro-view[dir="ltr"] .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child{
  direction:ltr!important;
  text-align:left!important;
}
html[dir="rtl"] body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child,
body.kls-rtl #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child,
#view-users.users-pro-view[dir="rtl"] .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child{
  direction:rtl!important;
  text-align:right!important;
}

html body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-icon{
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  flex:0 0 56px!important;
  order:0!important;
  margin:0!important;
  padding:0!important;
  border-radius:18px!important;
  display:grid!important;
  place-items:center!important;
  align-self:center!important;
  background:linear-gradient(180deg,#f7fbff,#eff7ff)!important;
  border:1px solid #cfe2f4!important;
  color:#0e8ceb!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
  position:relative!important;
  inset:auto!important;
  transform:none!important;
  z-index:1!important;
}
html body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-icon svg{
  width:21px!important;
  height:21px!important;
  display:block!important;
  stroke:currentColor!important;
  fill:none!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
html body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:flex-start!important;
  gap:0!important;
  min-width:0!important;
  max-width:100%!important;
  flex:1 1 auto!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html[dir="rtl"] body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text,
body.kls-rtl #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text,
#view-users.users-pro-view[dir="rtl"] .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text{
  align-items:flex-start!important;
  direction:rtl!important;
  text-align:right!important;
}
html[dir="ltr"] body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text,
body.kls-ltr #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text,
#view-users.users-pro-view[dir="ltr"] .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text{
  align-items:flex-start!important;
  direction:ltr!important;
  text-align:left!important;
}
html body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text h2,
html body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text p{
  display:block!important;
  position:relative!important;
  z-index:1!important;
  max-width:100%!important;
  margin-left:0!important;
  margin-right:0!important;
  padding:0!important;
  padding-left:0!important;
  padding-right:0!important;
  padding-inline-start:0!important;
  padding-inline-end:0!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  transform:none!important;
}
html body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text h2{
  margin-top:0!important;
  margin-bottom:7px!important;
  font-size:28px!important;
  line-height:1.08!important;
  font-weight:800!important;
  letter-spacing:-.035em!important;
  color:#071c34!important;
}
html body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text p{
  margin:0!important;
  font-size:15px!important;
  line-height:1.45!important;
  font-weight:500!important;
  letter-spacing:0!important;
  color:#60758e!important;
}
html[dir="ltr"] body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text h2,
html[dir="ltr"] body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text p,
body.kls-ltr #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text h2,
body.kls-ltr #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text p{
  text-align:left!important;
  direction:ltr!important;
}
html[dir="rtl"] body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text h2,
html[dir="rtl"] body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text p,
body.kls-rtl #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text h2,
body.kls-rtl #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text p{
  text-align:right!important;
  direction:rtl!important;
}

/* Keep the top actions exactly opposite the title block, like the approved header samples. */
html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions{
  flex:0 0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:12px!important;
  padding:0!important;
  margin:0!important;
  min-width:0!important;
  flex-wrap:nowrap!important;
}
html[dir="ltr"] body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions,
body.kls-ltr #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions,
#view-users.users-pro-view[dir="ltr"] .users-pro-head.kls-page-hero > .users-pro-actions{
  direction:ltr!important;
  margin-left:auto!important;
  margin-right:0!important;
}
html[dir="rtl"] body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions,
body.kls-rtl #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions,
#view-users.users-pro-view[dir="rtl"] .users-pro-head.kls-page-hero > .users-pro-actions{
  direction:rtl!important;
  margin-right:auto!important;
  margin-left:0!important;
}

body.theme-dark #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-icon,
.app-shell.dark #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-icon{
  background:#0b2032!important;
  border-color:#254866!important;
  color:#35b7ff!important;
  box-shadow:none!important;
}
body.theme-dark #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text h2,
.app-shell.dark #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text h2{color:#f5fbff!important;}
body.theme-dark #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text p,
.app-shell.dark #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text p{color:#9fb5c5!important;}

@media(max-width:900px){
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero{
    align-items:stretch!important;
    flex-direction:column!important;
    gap:14px!important;
    min-height:auto!important;
    padding:16px 18px!important;
    border-radius:22px!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child{
    min-height:46px!important;
    gap:12px!important;
    width:100%!important;
    flex:0 0 auto!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-icon{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    flex-basis:46px!important;
    border-radius:15px!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-icon svg{
    width:20px!important;
    height:20px!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text h2{
    font-size:24px!important;
    margin-bottom:5px!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child > .users-page-title-text p{
    font-size:13.5px!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions{
    width:100%!important;
    justify-content:stretch!important;
    flex-wrap:wrap!important;
    gap:10px!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field{
    flex:1 1 100%!important;
    min-width:0!important;
    width:100%!important;
  }
}


/* V3.0.22 — Page hero icon color polish
   Match Dashboard sample icon color/container on Template Design, Users & Permissions, and Print Center only. */
:root{
  --kls-sample-hero-icon-blue:#0e8ceb;
  --kls-sample-hero-icon-blue-dark:#35b7ff;
  --kls-sample-hero-icon-bg-top:#f7fbff;
  --kls-sample-hero-icon-bg-bottom:#eff7ff;
  --kls-sample-hero-icon-border:#cfe2f4;
}
#view-templates .phase6-page-title-icon,
#view-users.users-pro-view .users-page-title-icon,
#view-print .print-page-title-icon{
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  flex:0 0 56px!important;
  border-radius:18px!important;
  display:inline-grid!important;
  place-items:center!important;
  background:linear-gradient(180deg,var(--kls-sample-hero-icon-bg-top),var(--kls-sample-hero-icon-bg-bottom))!important;
  border:1px solid var(--kls-sample-hero-icon-border)!important;
  color:var(--kls-sample-hero-icon-blue)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
}
#view-templates .phase6-page-title-icon svg,
#view-templates .phase6-page-title-icon .phase6-svg-icon,
#view-users.users-pro-view .users-page-title-icon svg,
#view-print .print-page-title-icon svg,
#view-print .print-page-title-icon .kls-icon{
  width:22px!important;
  height:22px!important;
  color:var(--kls-sample-hero-icon-blue)!important;
  stroke:currentColor!important;
  fill:none!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
#view-templates .phase6-page-title-icon svg *,
#view-users.users-pro-view .users-page-title-icon svg *,
#view-print .print-page-title-icon svg *{
  color:var(--kls-sample-hero-icon-blue)!important;
  stroke:currentColor!important;
  fill:none!important;
}
body.theme-dark #view-templates .phase6-page-title-icon,
body.theme-dark #view-users.users-pro-view .users-page-title-icon,
body.theme-dark #view-print .print-page-title-icon,
.app-shell.dark #view-templates .phase6-page-title-icon,
.app-shell.dark #view-users.users-pro-view .users-page-title-icon,
.app-shell.dark #view-print .print-page-title-icon{
  background:linear-gradient(180deg,rgba(53,183,255,.16),rgba(53,183,255,.08))!important;
  border-color:#254866!important;
  color:var(--kls-sample-hero-icon-blue-dark)!important;
  box-shadow:none!important;
}
body.theme-dark #view-templates .phase6-page-title-icon svg,
body.theme-dark #view-templates .phase6-page-title-icon svg *,
body.theme-dark #view-users.users-pro-view .users-page-title-icon svg,
body.theme-dark #view-users.users-pro-view .users-page-title-icon svg *,
body.theme-dark #view-print .print-page-title-icon svg,
body.theme-dark #view-print .print-page-title-icon svg *,
.app-shell.dark #view-templates .phase6-page-title-icon svg,
.app-shell.dark #view-templates .phase6-page-title-icon svg *,
.app-shell.dark #view-users.users-pro-view .users-page-title-icon svg,
.app-shell.dark #view-users.users-pro-view .users-page-title-icon svg *,
.app-shell.dark #view-print .print-page-title-icon svg,
.app-shell.dark #view-print .print-page-title-icon svg *{
  color:var(--kls-sample-hero-icon-blue-dark)!important;
  stroke:currentColor!important;
  fill:none!important;
}
@media(max-width:900px){
  #view-templates .phase6-page-title-icon,
  #view-users.users-pro-view .users-page-title-icon,
  #view-print .print-page-title-icon{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    flex-basis:46px!important;
    border-radius:15px!important;
  }
  #view-templates .phase6-page-title-icon svg,
  #view-templates .phase6-page-title-icon .phase6-svg-icon,
  #view-users.users-pro-view .users-page-title-icon svg,
  #view-print .print-page-title-icon svg,
  #view-print .print-page-title-icon .kls-icon{
    width:20px!important;
    height:20px!important;
  }
}

/* V3.0.22 — Users & Permissions table RTL/LTR + password eye polish
   Scope: Users & Permissions page only. Keeps page hero/layout unchanged. */
#view-users.users-pro-view .users-password-wrap{
  display:flex!important;
  align-items:center!important;
  width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
  border-radius:14px!important;
}
#view-users.users-pro-view .users-password-wrap input#u_password{
  flex:1 1 auto!important;
  min-width:0!important;
  height:48px!important;
  box-shadow:none!important;
}
#view-users.users-pro-view .users-password-wrap .users-eye-btn{
  flex:0 0 48px!important;
  width:48px!important;
  min-width:48px!important;
  height:48px!important;
  padding:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  color:#254e70!important;
  background:#ffffff!important;
  box-shadow:none!important;
}
#view-users.users-pro-view .users-password-wrap .users-eye-btn svg{
  width:18px!important;
  height:18px!important;
  stroke:currentColor!important;
  fill:none!important;
}
html[dir="ltr"] #view-users.users-pro-view .users-password-wrap,
body.kls-ltr #view-users.users-pro-view .users-password-wrap,
#view-users.users-pro-view[dir="ltr"] .users-password-wrap{
  direction:ltr!important;
}
html[dir="ltr"] #view-users.users-pro-view .users-password-wrap input#u_password,
body.kls-ltr #view-users.users-pro-view .users-password-wrap input#u_password,
#view-users.users-pro-view[dir="ltr"] .users-password-wrap input#u_password{
  text-align:left!important;
  direction:ltr!important;
  border-radius:14px 0 0 14px!important;
  border-right:1px solid var(--users-line)!important;
  border-left:1px solid var(--users-line)!important;
}
html[dir="ltr"] #view-users.users-pro-view .users-password-wrap .users-eye-btn,
body.kls-ltr #view-users.users-pro-view .users-password-wrap .users-eye-btn,
#view-users.users-pro-view[dir="ltr"] .users-password-wrap .users-eye-btn{
  border-radius:0 14px 14px 0!important;
  border-left:0!important;
  border-right:1px solid var(--users-line)!important;
}
html[dir="rtl"] #view-users.users-pro-view .users-password-wrap,
body.kls-rtl #view-users.users-pro-view .users-password-wrap,
#view-users.users-pro-view[dir="rtl"] .users-password-wrap{
  direction:rtl!important;
}
html[dir="rtl"] #view-users.users-pro-view .users-password-wrap input#u_password,
body.kls-rtl #view-users.users-pro-view .users-password-wrap input#u_password,
#view-users.users-pro-view[dir="rtl"] .users-password-wrap input#u_password{
  text-align:right!important;
  direction:rtl!important;
  border-radius:0 14px 14px 0!important;
  border-left:1px solid var(--users-line)!important;
  border-right:1px solid var(--users-line)!important;
}
html[dir="rtl"] #view-users.users-pro-view .users-password-wrap .users-eye-btn,
body.kls-rtl #view-users.users-pro-view .users-password-wrap .users-eye-btn,
#view-users.users-pro-view[dir="rtl"] .users-password-wrap .users-eye-btn{
  border-radius:14px 0 0 14px!important;
  border-right:0!important;
  border-left:1px solid var(--users-line)!important;
}
#view-users.users-pro-view .users-password-wrap:focus-within input#u_password,
#view-users.users-pro-view .users-password-wrap:focus-within .users-eye-btn{
  border-color:#2eb8ef!important;
}
body.theme-dark #view-users.users-pro-view .users-password-wrap .users-eye-btn,
.app-shell.dark #view-users.users-pro-view .users-password-wrap .users-eye-btn{
  background:#071827!important;
  color:#8fd0ff!important;
  border-color:#28465d!important;
}

/* All Users table: logical alignment, correct column direction in LTR and RTL. */
#view-users.users-pro-view .users-table-pro,
#view-users.users-pro-view .users-permission-table{
  table-layout:auto!important;
  border-collapse:separate!important;
  border-spacing:0!important;
}
html[dir="ltr"] #view-users.users-pro-view .users-table-pro,
html[dir="ltr"] #view-users.users-pro-view .users-permission-table,
body.kls-ltr #view-users.users-pro-view .users-table-pro,
body.kls-ltr #view-users.users-pro-view .users-permission-table,
#view-users.users-pro-view[dir="ltr"] .users-table-pro,
#view-users.users-pro-view[dir="ltr"] .users-permission-table{
  direction:ltr!important;
}
html[dir="rtl"] #view-users.users-pro-view .users-table-pro,
html[dir="rtl"] #view-users.users-pro-view .users-permission-table,
body.kls-rtl #view-users.users-pro-view .users-table-pro,
body.kls-rtl #view-users.users-pro-view .users-permission-table,
#view-users.users-pro-view[dir="rtl"] .users-table-pro,
#view-users.users-pro-view[dir="rtl"] .users-permission-table{
  direction:rtl!important;
}
#view-users.users-pro-view .users-table-pro th,
#view-users.users-pro-view .users-table-pro td{
  vertical-align:middle!important;
  white-space:nowrap!important;
}
#view-users.users-pro-view .users-table-pro th:nth-child(1),
#view-users.users-pro-view .users-table-pro td:nth-child(1),
#view-users.users-pro-view .users-table-pro th:nth-child(2),
#view-users.users-pro-view .users-table-pro td:nth-child(2){
  text-align:start!important;
}
#view-users.users-pro-view .users-table-pro th:nth-child(3),
#view-users.users-pro-view .users-table-pro td:nth-child(3),
#view-users.users-pro-view .users-table-pro th:nth-child(4),
#view-users.users-pro-view .users-table-pro td:nth-child(4),
#view-users.users-pro-view .users-table-pro th:nth-child(5),
#view-users.users-pro-view .users-table-pro td:nth-child(5){
  text-align:center!important;
}
#view-users.users-pro-view .users-table-pro th:nth-child(6),
#view-users.users-pro-view .users-table-pro td:nth-child(6){
  text-align:end!important;
}
#view-users.users-pro-view .users-user-cell{
  direction:inherit!important;
  text-align:start!important;
}
#view-users.users-pro-view .users-user-cell span:last-child{
  min-width:0!important;
  text-align:start!important;
}
#view-users.users-pro-view .users-row-actions{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  direction:inherit!important;
}
html[dir="rtl"] #view-users.users-pro-view .users-row-actions,
body.kls-rtl #view-users.users-pro-view .users-row-actions,
#view-users.users-pro-view[dir="rtl"] .users-row-actions{
  justify-content:flex-start!important;
}

/* Role Permissions matrix: keep permission names on the natural side of each language. */
#view-users.users-pro-view .users-permission-table th,
#view-users.users-pro-view .users-permission-table td{
  vertical-align:middle!important;
  white-space:nowrap!important;
}
#view-users.users-pro-view .users-permission-table th:first-child,
#view-users.users-pro-view .users-permission-table td:first-child{
  text-align:start!important;
  min-width:230px!important;
  width:28%!important;
}
#view-users.users-pro-view .users-permission-table th:not(:first-child),
#view-users.users-pro-view .users-permission-table td:not(:first-child){
  text-align:center!important;
}
#view-users.users-pro-view .users-permission-table td:first-child strong{
  display:block!important;
  text-align:start!important;
  direction:inherit!important;
  line-height:1.25!important;
}
@media(max-width:760px){
  #view-users.users-pro-view .users-table-pro{min-width:660px!important;}
  #view-users.users-pro-view .users-permission-table{min-width:720px!important;}
  #view-users.users-pro-view .users-table-pro th,
  #view-users.users-pro-view .users-table-pro td,
  #view-users.users-pro-view .users-permission-table th,
  #view-users.users-pro-view .users-permission-table td{
    padding:12px 10px!important;
    font-size:12px!important;
  }
  #view-users.users-pro-view .users-permission-table th:first-child,
  #view-users.users-pro-view .users-permission-table td:first-child{
    min-width:210px!important;
  }
}


/* V3.0.25 — Users & Permissions mobile top actions PRO alignment
   Scope: Users & Permissions page only. Keeps desktop layout unchanged.
   Fixes mobile Search / Filter / New User to show together in one polished row for LTR and RTL. */
@media (max-width: 760px){
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero{
    overflow:visible!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > div.users-page-title-wrap:first-child{
    order:1!important;
    width:100%!important;
    max-width:100%!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions{
    order:2!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:2px 0 0!important;
    padding:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(70px,.42fr) minmax(104px,.62fr)!important;
    align-items:center!important;
    justify-content:stretch!important;
    gap:8px!important;
    flex:none!important;
    flex-wrap:nowrap!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  html[dir="ltr"] body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions,
  body.kls-ltr #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions,
  #view-users.users-pro-view[dir="ltr"] .users-pro-head.kls-page-hero > .users-pro-actions{
    direction:ltr!important;
  }
  html[dir="rtl"] body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions,
  body.kls-rtl #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions,
  #view-users.users-pro-view[dir="rtl"] .users-pro-head.kls-page-hero > .users-pro-actions{
    direction:rtl!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field{
    grid-column:auto!important;
    grid-row:1!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:42px!important;
    min-height:42px!important;
    padding:0 10px!important;
    margin:0!important;
    border-radius:15px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:7px!important;
    flex:none!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field svg{
    width:16px!important;
    height:16px!important;
    min-width:16px!important;
    flex:0 0 16px!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field input{
    width:100%!important;
    min-width:0!important;
    height:40px!important;
    font-size:12px!important;
    line-height:1!important;
    font-weight:750!important;
    padding:0!important;
    margin:0!important;
  }
  html[dir="ltr"] body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field,
  body.kls-ltr #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field,
  #view-users.users-pro-view[dir="ltr"] .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field{
    direction:ltr!important;
    text-align:left!important;
  }
  html[dir="ltr"] body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field input,
  body.kls-ltr #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field input,
  #view-users.users-pro-view[dir="ltr"] .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field input{
    text-align:left!important;
    direction:ltr!important;
  }
  html[dir="rtl"] body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field,
  body.kls-rtl #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field,
  #view-users.users-pro-view[dir="rtl"] .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field{
    direction:rtl!important;
    text-align:right!important;
  }
  html[dir="rtl"] body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field input,
  body.kls-rtl #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field input,
  #view-users.users-pro-view[dir="rtl"] .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field input{
    text-align:right!important;
    direction:rtl!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-filter-btn,
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-primary-action{
    grid-row:1!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:42px!important;
    min-height:42px!important;
    padding:0 9px!important;
    margin:0!important;
    border-radius:15px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    font-size:11.5px!important;
    font-weight:850!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    box-sizing:border-box!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-filter-btn svg,
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-primary-action svg{
    width:15px!important;
    height:15px!important;
    min-width:15px!important;
    flex:0 0 15px!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-filter-btn span,
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-primary-action span{
    display:block!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
}
@media (max-width: 380px){
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions{
    grid-template-columns:minmax(0,1fr) 44px minmax(84px,.62fr)!important;
    gap:7px!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-filter-btn{
    padding:0!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-filter-btn span{
    display:none!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-primary-action{
    padding:0 8px!important;
    font-size:10.5px!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions .users-search-field input{
    font-size:11px!important;
  }
}

/* V3.0.25 — Users & Permissions mobile actions detached PRO row
   Scope: Users & Permissions page only. On mobile, Search / Filter / New User are placed directly under the hero card
   as one visible row, preserving desktop layout and RTL/LTR behavior. */
#view-users.users-pro-view .users-actions-home-marker{display:none!important;}
@media (max-width:760px){
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero{
    overflow:visible!important;
    margin-bottom:10px!important;
  }
  html body #view-users.users-pro-view .users-pro-head.kls-page-hero > .users-pro-actions:not(.users-mobile-actions-detached){
    display:none!important;
  }
  html body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(54px,66px) minmax(92px,108px)!important;
    align-items:center!important;
    justify-content:stretch!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0 0 14px!important;
    padding:10px!important;
    border-radius:20px!important;
    background:rgba(255,255,255,.82)!important;
    border:1px solid rgba(207,223,237,.88)!important;
    box-shadow:0 18px 34px rgba(12,31,48,.08)!important;
    overflow:visible!important;
    box-sizing:border-box!important;
    flex:none!important;
  }
  html[dir="ltr"] body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached,
  body.kls-ltr #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached,
  #view-users.users-pro-view[dir="ltr"] > .users-pro-actions.users-mobile-actions-detached{
    direction:ltr!important;
  }
  html[dir="rtl"] body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached,
  body.kls-rtl #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached,
  #view-users.users-pro-view[dir="rtl"] > .users-pro-actions.users-mobile-actions-detached{
    direction:rtl!important;
  }
  html body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-search-field{
    grid-row:1!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:42px!important;
    min-height:42px!important;
    margin:0!important;
    padding:0 11px!important;
    border-radius:15px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:7px!important;
    background:rgba(255,255,255,.94)!important;
    border:1px solid #cfdfed!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    flex:none!important;
  }
  html body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-search-field svg{
    width:16px!important;
    height:16px!important;
    min-width:16px!important;
    flex:0 0 16px!important;
    color:#5d7690!important;
  }
  html body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-search-field input{
    width:100%!important;
    min-width:0!important;
    height:40px!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
    font-size:12px!important;
    line-height:1!important;
    font-weight:800!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  html[dir="ltr"] body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-search-field,
  body.kls-ltr #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-search-field,
  #view-users.users-pro-view[dir="ltr"] > .users-pro-actions.users-mobile-actions-detached .users-search-field{
    direction:ltr!important;
    text-align:left!important;
  }
  html[dir="ltr"] body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-search-field input,
  body.kls-ltr #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-search-field input,
  #view-users.users-pro-view[dir="ltr"] > .users-pro-actions.users-mobile-actions-detached .users-search-field input{
    direction:ltr!important;
    text-align:left!important;
  }
  html[dir="rtl"] body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-search-field,
  body.kls-rtl #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-search-field,
  #view-users.users-pro-view[dir="rtl"] > .users-pro-actions.users-mobile-actions-detached .users-search-field{
    direction:rtl!important;
    text-align:right!important;
  }
  html[dir="rtl"] body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-search-field input,
  body.kls-rtl #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-search-field input,
  #view-users.users-pro-view[dir="rtl"] > .users-pro-actions.users-mobile-actions-detached .users-search-field input{
    direction:rtl!important;
    text-align:right!important;
  }
  html body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-filter-btn,
  html body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-primary-action{
    grid-row:1!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:42px!important;
    min-height:42px!important;
    margin:0!important;
    padding:0 9px!important;
    border-radius:15px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    font-size:11.5px!important;
    font-weight:900!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    box-sizing:border-box!important;
    flex:none!important;
  }
  html body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-filter-btn svg,
  html body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-primary-action svg{
    width:15px!important;
    height:15px!important;
    min-width:15px!important;
    flex:0 0 15px!important;
  }
  html body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-filter-btn span,
  html body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-primary-action span{
    display:block!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  body.theme-dark #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached,
  .app-shell.dark #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached{
    background:rgba(7,22,34,.82)!important;
    border-color:rgba(75,125,158,.42)!important;
    box-shadow:0 18px 34px rgba(0,0,0,.22)!important;
  }
  body.theme-dark #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-search-field,
  body.theme-dark #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-filter-btn,
  .app-shell.dark #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-search-field,
  .app-shell.dark #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-filter-btn{
    background:rgba(11,31,46,.92)!important;
    border-color:rgba(82,136,172,.52)!important;
    color:#eaf4ff!important;
  }
}
@media (max-width:390px){
  html body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached{
    grid-template-columns:minmax(0,1fr) 46px minmax(82px,92px)!important;
    gap:7px!important;
    padding:9px!important;
  }
  html body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-filter-btn{
    padding:0!important;
  }
  html body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-filter-btn span{
    display:none!important;
  }
  html body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-primary-action{
    padding:0 7px!important;
    font-size:10.5px!important;
  }
  html body #view-users.users-pro-view > .users-pro-actions.users-mobile-actions-detached .users-search-field input{
    font-size:11px!important;
  }
}

/* V3.0.26 — Print Center mobile hero match sample + global quantity centering
   Scope: Print Center page hero layout and quantity numeric inputs only. */
#view-print.print-pro-view .print-pro-head.kls-page-hero > div:first-child{
  display:grid!important;
  grid-template-columns:56px minmax(0,1fr)!important;
  grid-template-areas:"printIcon printTitle" "printIcon printDesc"!important;
  align-items:center!important;
  column-gap:16px!important;
  row-gap:4px!important;
  min-width:0!important;
  width:auto!important;
  max-width:100%!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title{
  display:contents!important;
  margin:0!important;
  padding:0!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon{
  grid-area:printIcon!important;
  align-self:center!important;
  justify-self:center!important;
  margin:0!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero h2{
  grid-area:printTitle!important;
  margin:0!important;
  padding:0!important;
  align-self:end!important;
  min-width:0!important;
  line-height:1.12!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title + p,
#view-print.print-pro-view .print-pro-head.kls-page-hero p.muted{
  grid-area:printDesc!important;
  margin:0!important;
  padding:0!important;
  align-self:start!important;
  min-width:0!important;
  line-height:1.35!important;
}
html[dir="ltr"] #view-print.print-pro-view .print-pro-head.kls-page-hero > div:first-child,
body.kls-ltr #view-print.print-pro-view .print-pro-head.kls-page-hero > div:first-child,
#view-print.print-pro-view[dir="ltr"] .print-pro-head.kls-page-hero > div:first-child{
  direction:ltr!important;
  grid-template-columns:56px minmax(0,1fr)!important;
  grid-template-areas:"printIcon printTitle" "printIcon printDesc"!important;
  text-align:left!important;
}
html[dir="rtl"] #view-print.print-pro-view .print-pro-head.kls-page-hero > div:first-child,
body.kls-rtl #view-print.print-pro-view .print-pro-head.kls-page-hero > div:first-child,
#view-print.print-pro-view[dir="rtl"] .print-pro-head.kls-page-hero > div:first-child{
  direction:rtl!important;
  grid-template-columns:minmax(0,1fr) 56px!important;
  grid-template-areas:"printTitle printIcon" "printDesc printIcon"!important;
  text-align:right!important;
}
html[dir="ltr"] #view-print.print-pro-view .print-pro-head.kls-page-hero h2,
html[dir="ltr"] #view-print.print-pro-view .print-pro-head.kls-page-hero p.muted,
body.kls-ltr #view-print.print-pro-view .print-pro-head.kls-page-hero h2,
body.kls-ltr #view-print.print-pro-view .print-pro-head.kls-page-hero p.muted,
#view-print.print-pro-view[dir="ltr"] .print-pro-head.kls-page-hero h2,
#view-print.print-pro-view[dir="ltr"] .print-pro-head.kls-page-hero p.muted{
  text-align:left!important;
}
html[dir="rtl"] #view-print.print-pro-view .print-pro-head.kls-page-hero h2,
html[dir="rtl"] #view-print.print-pro-view .print-pro-head.kls-page-hero p.muted,
body.kls-rtl #view-print.print-pro-view .print-pro-head.kls-page-hero h2,
body.kls-rtl #view-print.print-pro-view .print-pro-head.kls-page-hero p.muted,
#view-print.print-pro-view[dir="rtl"] .print-pro-head.kls-page-hero h2,
#view-print.print-pro-view[dir="rtl"] .print-pro-head.kls-page-hero p.muted{
  text-align:right!important;
}
@media(max-width:760px){
  #view-print.print-pro-view .print-pro-head.kls-page-hero{
    padding:14px!important;
    min-height:0!important;
    align-items:center!important;
  }
  #view-print.print-pro-view .print-pro-head.kls-page-hero > div:first-child{
    width:100%!important;
    max-width:100%!important;
    column-gap:12px!important;
    row-gap:3px!important;
  }
  html[dir="ltr"] #view-print.print-pro-view .print-pro-head.kls-page-hero > div:first-child,
  body.kls-ltr #view-print.print-pro-view .print-pro-head.kls-page-hero > div:first-child,
  #view-print.print-pro-view[dir="ltr"] .print-pro-head.kls-page-hero > div:first-child{
    grid-template-columns:46px minmax(0,1fr)!important;
    grid-template-areas:"printIcon printTitle" "printIcon printDesc"!important;
  }
  html[dir="rtl"] #view-print.print-pro-view .print-pro-head.kls-page-hero > div:first-child,
  body.kls-rtl #view-print.print-pro-view .print-pro-head.kls-page-hero > div:first-child,
  #view-print.print-pro-view[dir="rtl"] .print-pro-head.kls-page-hero > div:first-child{
    grid-template-columns:minmax(0,1fr) 46px!important;
    grid-template-areas:"printTitle printIcon" "printDesc printIcon"!important;
  }
  #view-print.print-pro-view .print-pro-head.kls-page-hero h2{
    font-size:15.5px!important;
    letter-spacing:-.015em!important;
    white-space:normal!important;
  }
  #view-print.print-pro-view .print-pro-head.kls-page-hero p.muted{
    font-size:11.5px!important;
    line-height:1.32!important;
    white-space:normal!important;
  }
}

/* Center quantity numbers everywhere while keeping plus/minus/icon positions unchanged. */
#view-products #p_quantity,
#view-shipping #s_quantity,
#view-print #printQuantity,
.qty-stepper input[type="number"],
.print-qty-stepper input[type="number"]{
  text-align:center!important;
  direction:ltr!important;
  unicode-bidi:isolate!important;
  padding-left:0!important;
  padding-right:0!important;
  justify-self:center!important;
  align-self:center!important;
}
#view-print .print-qty-stepper{
  align-items:center!important;
}
#view-print .print-qty-stepper #printQuantity{
  display:block!important;
  width:100%!important;
  margin:0 auto!important;
  font-variant-numeric:tabular-nums!important;
}


/* V3.0.30 — Print Center RTL mobile/desktop hero icon match sample
   Scope: Print Center page hero only. Uses a real flex title wrapper so the icon/text spacing
   matches the approved Users & Permissions/Dashboard hero style in EN/KU/AR. */
#view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:16px!important;
  min-height:56px!important;
  min-width:0!important;
  max-width:100%!important;
  width:auto!important;
  flex:0 1 auto!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
  text-align:start!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text{
  display:block!important;
  min-width:0!important;
  max-width:100%!important;
  flex:0 1 auto!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text h2,
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text p{
  position:relative!important;
  z-index:1!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  text-align:inherit!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text h2{
  line-height:1.12!important;
  margin-bottom:6px!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text p{
  line-height:1.35!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon{
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  flex:0 0 56px!important;
  border-radius:18px!important;
  display:grid!important;
  place-items:center!important;
  background:linear-gradient(180deg,#f7fbff,#eff7ff)!important;
  border:1px solid #cfe2f4!important;
  color:#0e8ceb!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
  margin:0!important;
  align-self:center!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon svg,
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon svg *{
  width:22px!important;
  height:22px!important;
  stroke:currentColor!important;
  fill:none!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
html[dir="ltr"] #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap,
body.kls-ltr #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap,
#view-print.print-pro-view[dir="ltr"] .print-pro-head.kls-page-hero > .print-page-title-wrap{
  direction:ltr!important;
  flex-direction:row!important;
  text-align:left!important;
}
html[dir="rtl"] #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap,
body.kls-rtl #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap,
#view-print.print-pro-view[dir="rtl"] .print-pro-head.kls-page-hero > .print-page-title-wrap{
  direction:ltr!important;
  flex-direction:row-reverse!important;
  justify-content:flex-end!important;
  text-align:right!important;
}
html[dir="ltr"] #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text,
body.kls-ltr #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text,
#view-print.print-pro-view[dir="ltr"] .print-pro-head.kls-page-hero .print-page-title-text{
  direction:ltr!important;
  text-align:left!important;
}
html[dir="rtl"] #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text,
body.kls-rtl #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text,
#view-print.print-pro-view[dir="rtl"] .print-pro-head.kls-page-hero .print-page-title-text{
  direction:rtl!important;
  text-align:right!important;
}
body.theme-dark #view-print.print-pro-view .print-page-title-icon,
.app-shell.dark #view-print.print-pro-view .print-page-title-icon{
  background:#0b2032!important;
  border-color:#254866!important;
  color:#35b7ff!important;
  box-shadow:none!important;
}
@media(max-width:900px){
  #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap{
    min-height:46px!important;
    gap:12px!important;
    padding:0!important;
    width:100%!important;
    max-width:100%!important;
  }
  #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    flex-basis:46px!important;
    border-radius:15px!important;
  }
  #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon svg,
  #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon svg *{
    width:20px!important;
    height:20px!important;
  }
  #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text h2{
    font-size:15.5px!important;
    line-height:1.12!important;
    letter-spacing:-.015em!important;
    margin-bottom:4px!important;
  }
  #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text p{
    font-size:11.5px!important;
    line-height:1.32!important;
  }
}

/* V3.0.31 — Print Center RTL/LTR Hero Icon Final Lock
   Scope: Print Center page hero only.
   Fixes the KU/AR header title block so the printer icon is physically on the RIGHT side,
   matching Users & Permissions, while English stays icon LEFT + text RIGHT. */
#view-print.print-pro-view .print-pro-head.kls-page-hero{
  display:flex!important;
  align-items:center!important;
}
html[dir="ltr"] #view-print.print-pro-view .print-pro-head.kls-page-hero,
body.kls-ltr #view-print.print-pro-view .print-pro-head.kls-page-hero,
#view-print.print-pro-view[dir="ltr"] .print-pro-head.kls-page-hero{
  direction:ltr!important;
  justify-content:flex-start!important;
}
html[dir="rtl"] #view-print.print-pro-view .print-pro-head.kls-page-hero,
body.kls-rtl #view-print.print-pro-view .print-pro-head.kls-page-hero,
#view-print.print-pro-view[dir="rtl"] .print-pro-head.kls-page-hero{
  direction:rtl!important;
  justify-content:flex-start!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap{
  display:grid!important;
  align-items:center!important;
  gap:16px!important;
  min-height:56px!important;
  width:auto!important;
  max-width:100%!important;
  flex:0 1 auto!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon{
  grid-area:printIcon!important;
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  justify-self:center!important;
  align-self:center!important;
  margin:0!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text{
  grid-area:printText!important;
  min-width:0!important;
  max-width:100%!important;
}
html[dir="ltr"] #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap,
body.kls-ltr #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap,
#view-print.print-pro-view[dir="ltr"] .print-pro-head.kls-page-hero > .print-page-title-wrap{
  direction:ltr!important;
  grid-template-columns:56px minmax(0,auto)!important;
  grid-template-areas:"printIcon printText"!important;
  justify-content:start!important;
  text-align:left!important;
}
html[dir="rtl"] #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap,
body.kls-rtl #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap,
#view-print.print-pro-view[dir="rtl"] .print-pro-head.kls-page-hero > .print-page-title-wrap{
  direction:ltr!important;
  grid-template-columns:minmax(0,auto) 56px!important;
  grid-template-areas:"printText printIcon"!important;
  justify-content:start!important;
  text-align:right!important;
}
html[dir="ltr"] #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text,
body.kls-ltr #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text,
#view-print.print-pro-view[dir="ltr"] .print-pro-head.kls-page-hero .print-page-title-text{
  direction:ltr!important;
  text-align:left!important;
  justify-self:start!important;
}
html[dir="rtl"] #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text,
body.kls-rtl #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text,
#view-print.print-pro-view[dir="rtl"] .print-pro-head.kls-page-hero .print-page-title-text{
  direction:rtl!important;
  text-align:right!important;
  justify-self:end!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text h2,
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text p{
  text-align:inherit!important;
}
@media(max-width:900px){
  #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap{gap:12px!important;min-height:46px!important;}
  #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon{width:46px!important;height:46px!important;min-width:46px!important;}
  html[dir="ltr"] #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap,
  body.kls-ltr #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap,
  #view-print.print-pro-view[dir="ltr"] .print-pro-head.kls-page-hero > .print-page-title-wrap{grid-template-columns:46px minmax(0,auto)!important;}
  html[dir="rtl"] #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap,
  body.kls-rtl #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap,
  #view-print.print-pro-view[dir="rtl"] .print-pro-head.kls-page-hero > .print-page-title-wrap{grid-template-columns:minmax(0,auto) 46px!important;}
}


/* V3.0.32 — Print Center hero spacing + mobile placement rebuild
   Goal: match Users & Permissions header title block sizing/spacing.
   Fixes:
   - removes the oversized gap between printer icon and title text
   - keeps the title block compact instead of stretched
   - keeps English/LTR icon on the LEFT
   - keeps Kurdish/Arabic/RTL icon on the RIGHT
   - fixes mobile placement so the title block stays in the correct location */
#view-print.print-pro-view .print-pro-head.kls-page-hero{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:0!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap{
  position:relative!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:16px!important;
  min-height:56px!important;
  min-width:0!important;
  width:auto!important;
  max-width:min(100%, 720px)!important;
  flex:0 1 auto!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html[dir="ltr"] #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap,
body.kls-ltr #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap,
#view-print.print-pro-view[dir="ltr"] .print-pro-head.kls-page-hero > .print-page-title-wrap{
  flex-direction:row!important;
  text-align:left!important;
}
html[dir="rtl"] #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap,
body.kls-rtl #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap,
#view-print.print-pro-view[dir="rtl"] .print-pro-head.kls-page-hero > .print-page-title-wrap{
  flex-direction:row-reverse!important;
  text-align:right!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon{
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  flex:0 0 56px!important;
  order:0!important;
  margin:0!important;
  padding:0!important;
  border-radius:18px!important;
  display:grid!important;
  place-items:center!important;
  align-self:center!important;
  justify-self:auto!important;
  background:linear-gradient(180deg,#f7fbff,#eff7ff)!important;
  border:1px solid #cfe2f4!important;
  color:#0e8ceb!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
  position:relative!important;
  inset:auto!important;
  transform:none!important;
  z-index:1!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon svg,
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon svg *{
  width:21px!important;
  height:21px!important;
  display:block!important;
  stroke:currentColor!important;
  fill:none!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:flex-start!important;
  gap:0!important;
  min-width:0!important;
  max-width:100%!important;
  flex:0 1 auto!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html[dir="ltr"] #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text,
body.kls-ltr #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text,
#view-print.print-pro-view[dir="ltr"] .print-pro-head.kls-page-hero .print-page-title-text{
  direction:ltr!important;
  text-align:left!important;
  align-items:flex-start!important;
}
html[dir="rtl"] #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text,
body.kls-rtl #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text,
#view-print.print-pro-view[dir="rtl"] .print-pro-head.kls-page-hero .print-page-title-text{
  direction:rtl!important;
  text-align:right!important;
  align-items:flex-end!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text h2,
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text p{
  display:block!important;
  max-width:100%!important;
  margin-left:0!important;
  margin-right:0!important;
  padding:0!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  text-align:inherit!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text h2{
  margin:0 0 7px!important;
  font-size:28px!important;
  line-height:1.08!important;
  font-weight:800!important;
  letter-spacing:-.035em!important;
  color:#071c34!important;
}
#view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text p{
  margin:0!important;
  font-size:15px!important;
  line-height:1.45!important;
  font-weight:500!important;
  letter-spacing:0!important;
  color:#60758e!important;
}
body.theme-dark #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon,
.app-shell.dark #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon{
  background:#0b2032!important;
  border-color:#254866!important;
  color:#35b7ff!important;
  box-shadow:none!important;
}
body.theme-dark #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text h2,
.app-shell.dark #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text h2{color:#f5fbff!important;}
body.theme-dark #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text p,
.app-shell.dark #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text p{color:#9fb5c5!important;}
@media(max-width:900px){
  #view-print.print-pro-view .print-pro-head.kls-page-hero{
    align-items:stretch!important;
    min-height:auto!important;
    padding:16px 18px!important;
    border-radius:22px!important;
  }
  #view-print.print-pro-view .print-pro-head.kls-page-hero > .print-page-title-wrap{
    width:100%!important;
    max-width:100%!important;
    min-height:46px!important;
    gap:12px!important;
  }
  #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    flex-basis:46px!important;
    border-radius:15px!important;
  }
  #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon svg,
  #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon svg *{
    width:20px!important;
    height:20px!important;
  }
  #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text h2{
    font-size:24px!important;
    margin-bottom:5px!important;
  }
  #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-text p{
    font-size:13.5px!important;
  }
}

/* V3.0.33 — Print Center hero FULL REBUILD from scratch
   This uses new dedicated markup/classes and overrides all old Print Center hero rules.
   English/LTR: icon LEFT + text RIGHT, block aligned LEFT.
   Kurdish/Arabic/RTL: icon RIGHT + text LEFT, block aligned RIGHT.
   Mobile: compact, direction-aware, no stretched/centered title gap. */
html body #view-print.print-pro-view .print-pro-head.kls-page-hero.kls-print-hero-v33{
  display:flex!important;
  align-items:center!important;
  min-height:108px!important;
  padding:20px 26px!important;
  border-radius:24px!important;
  gap:0!important;
  overflow:hidden!important;
}
html[dir="ltr"] body #view-print.print-pro-view .print-pro-head.kls-page-hero.kls-print-hero-v33,
body.kls-ltr #view-print.print-pro-view .print-pro-head.kls-page-hero.kls-print-hero-v33,
#view-print.print-pro-view[dir="ltr"] .print-pro-head.kls-page-hero.kls-print-hero-v33{
  direction:ltr!important;
  justify-content:flex-start!important;
  text-align:left!important;
}
html[dir="rtl"] body #view-print.print-pro-view .print-pro-head.kls-page-hero.kls-print-hero-v33,
body.kls-rtl #view-print.print-pro-view .print-pro-head.kls-page-hero.kls-print-hero-v33,
#view-print.print-pro-view[dir="rtl"] .print-pro-head.kls-page-hero.kls-print-hero-v33{
  direction:rtl!important;
  justify-content:flex-start!important;
  text-align:right!important;
}
html body #view-print.print-pro-view .print-pro-head.kls-page-hero.kls-print-hero-v33 > .kls-print-hero-inner-v33{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  gap:16px!important;
  min-height:56px!important;
  width:auto!important;
  max-width:min(100%, 720px)!important;
  min-width:0!important;
  flex:0 1 auto!important;
  padding:0!important;
  margin:0!important;
  box-sizing:border-box!important;
  overflow:visible!important;
  transform:none!important;
}
html[dir="ltr"] body #view-print.print-pro-view .print-pro-head.kls-page-hero.kls-print-hero-v33 > .kls-print-hero-inner-v33,
body.kls-ltr #view-print.print-pro-view .print-pro-head.kls-page-hero.kls-print-hero-v33 > .kls-print-hero-inner-v33,
#view-print.print-pro-view[dir="ltr"] .print-pro-head.kls-page-hero.kls-print-hero-v33 > .kls-print-hero-inner-v33{
  direction:ltr!important;
  flex-direction:row!important;
  margin-left:0!important;
  margin-right:auto!important;
  text-align:left!important;
}
html[dir="rtl"] body #view-print.print-pro-view .print-pro-head.kls-page-hero.kls-print-hero-v33 > .kls-print-hero-inner-v33,
body.kls-rtl #view-print.print-pro-view .print-pro-head.kls-page-hero.kls-print-hero-v33 > .kls-print-hero-inner-v33,
#view-print.print-pro-view[dir="rtl"] .print-pro-head.kls-page-hero.kls-print-hero-v33 > .kls-print-hero-inner-v33{
  direction:rtl!important;
  flex-direction:row!important;
  margin-right:0!important;
  margin-left:auto!important;
  text-align:right!important;
}
html body #view-print.print-pro-view .print-pro-head.kls-page-hero.kls-print-hero-v33 > .kls-print-hero-inner-v33::before,
html body #view-print.print-pro-view .print-pro-head.kls-page-hero.kls-print-hero-v33 > .kls-print-hero-inner-v33::after{
  content:none!important;
  display:none!important;
}
html body #view-print.print-pro-view .kls-print-hero-icon-v33{
  display:grid!important;
  place-items:center!important;
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  flex:0 0 56px!important;
  padding:0!important;
  margin:0!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#f7fbff,#eff7ff)!important;
  border:1px solid #cfe2f4!important;
  color:#0e8ceb!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
  position:relative!important;
  inset:auto!important;
  transform:none!important;
}
html body #view-print.print-pro-view .kls-print-hero-icon-v33 svg,
html body #view-print.print-pro-view .kls-print-hero-icon-v33 svg *{
  display:block!important;
  width:21px!important;
  height:21px!important;
  stroke:currentColor!important;
  fill:none!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
html body #view-print.print-pro-view .kls-print-hero-copy-v33{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:0!important;
  min-width:0!important;
  max-width:100%!important;
  flex:0 1 auto!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html[dir="ltr"] body #view-print.print-pro-view .kls-print-hero-copy-v33,
body.kls-ltr #view-print.print-pro-view .kls-print-hero-copy-v33,
#view-print.print-pro-view[dir="ltr"] .kls-print-hero-copy-v33{
  direction:ltr!important;
  text-align:left!important;
  align-items:flex-start!important;
}
html[dir="rtl"] body #view-print.print-pro-view .kls-print-hero-copy-v33,
body.kls-rtl #view-print.print-pro-view .kls-print-hero-copy-v33,
#view-print.print-pro-view[dir="rtl"] .kls-print-hero-copy-v33{
  direction:rtl!important;
  text-align:right!important;
  align-items:flex-end!important;
}
html body #view-print.print-pro-view .kls-print-hero-copy-v33 h2,
html body #view-print.print-pro-view .kls-print-hero-copy-v33 p{
  display:block!important;
  max-width:100%!important;
  padding:0!important;
  margin-left:0!important;
  margin-right:0!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  text-align:inherit!important;
  transform:none!important;
}
html body #view-print.print-pro-view .kls-print-hero-copy-v33 h2{
  margin-top:0!important;
  margin-bottom:7px!important;
  font-size:28px!important;
  line-height:1.08!important;
  font-weight:800!important;
  letter-spacing:-.035em!important;
  color:#071c34!important;
}
html body #view-print.print-pro-view .kls-print-hero-copy-v33 p{
  margin-top:0!important;
  margin-bottom:0!important;
  font-size:15px!important;
  line-height:1.45!important;
  font-weight:500!important;
  letter-spacing:0!important;
  color:#60758e!important;
}
body.theme-dark #view-print.print-pro-view .kls-print-hero-icon-v33,
.app-shell.dark #view-print.print-pro-view .kls-print-hero-icon-v33{
  background:#0b2032!important;
  border-color:#254866!important;
  color:#35b7ff!important;
  box-shadow:none!important;
}
body.theme-dark #view-print.print-pro-view .kls-print-hero-copy-v33 h2,
.app-shell.dark #view-print.print-pro-view .kls-print-hero-copy-v33 h2{color:#f5fbff!important;}
body.theme-dark #view-print.print-pro-view .kls-print-hero-copy-v33 p,
.app-shell.dark #view-print.print-pro-view .kls-print-hero-copy-v33 p{color:#9fb5c5!important;}
@media(max-width:900px){
  html body #view-print.print-pro-view .print-pro-head.kls-page-hero.kls-print-hero-v33{
    min-height:auto!important;
    padding:16px 18px!important;
    border-radius:22px!important;
    align-items:center!important;
  }
  html body #view-print.print-pro-view .print-pro-head.kls-page-hero.kls-print-hero-v33 > .kls-print-hero-inner-v33{
    min-height:46px!important;
    width:100%!important;
    max-width:100%!important;
    gap:12px!important;
  }
  html body #view-print.print-pro-view .kls-print-hero-icon-v33{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    flex-basis:46px!important;
    border-radius:15px!important;
  }
  html body #view-print.print-pro-view .kls-print-hero-icon-v33 svg,
  html body #view-print.print-pro-view .kls-print-hero-icon-v33 svg *{
    width:20px!important;
    height:20px!important;
  }
  html body #view-print.print-pro-view .kls-print-hero-copy-v33 h2{
    font-size:24px!important;
    margin-bottom:5px!important;
  }
  html body #view-print.print-pro-view .kls-print-hero-copy-v33 p{
    font-size:13.5px!important;
    line-height:1.35!important;
  }
}
@media(max-width:480px){
  html body #view-print.print-pro-view .print-pro-head.kls-page-hero.kls-print-hero-v33{
    padding:14px!important;
  }
  html body #view-print.print-pro-view .print-pro-head.kls-page-hero.kls-print-hero-v33 > .kls-print-hero-inner-v33{
    gap:10px!important;
  }
  html body #view-print.print-pro-view .kls-print-hero-copy-v33 h2{
    font-size:20px!important;
  }
  html body #view-print.print-pro-view .kls-print-hero-copy-v33 p{
    font-size:11.5px!important;
  }
}


/* V3.0.36 — Hero title direction polish from V3.0.33 baseline
   Scope only: Print Center, Activity Log, Security, Settings page hero title blocks.
   Based on V3.0.33 structure. Does not use the V3.0.34/35 changes.
   Fix:
   - headline/subtitle text is a normal block, not a flex container, so RTL text starts correctly
   - Kurdish/Arabic: icon on physical RIGHT, text reads RTL and aligns RIGHT
   - English: icon on physical LEFT, text reads LTR and aligns LEFT
   - Print icon color/style kept consistent with the approved hero icons */

/* Print Center — keep V3.0.33 layout, only fix text block direction/alignment */
html body #view-print.print-pro-view .kls-print-hero-icon-v33{
  background:linear-gradient(180deg,#f7fbff,#eff7ff)!important;
  border:1px solid #cfe2f4!important;
  color:#0e8ceb!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
}
html body #view-print.print-pro-view .kls-print-hero-icon-v33 svg,
html body #view-print.print-pro-view .kls-print-hero-icon-v33 svg *{
  stroke:currentColor!important;
  color:currentColor!important;
  fill:none!important;
}
html body #view-print.print-pro-view .kls-print-hero-copy-v33{
  display:block!important;
  flex:0 1 auto!important;
  min-width:0!important;
  max-width:100%!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html[dir="ltr"] body #view-print.print-pro-view .kls-print-hero-copy-v33,
body.kls-ltr #view-print.print-pro-view .kls-print-hero-copy-v33,
#view-print.print-pro-view[dir="ltr"] .kls-print-hero-copy-v33{
  direction:ltr!important;
  text-align:left!important;
}
html[dir="rtl"] body #view-print.print-pro-view .kls-print-hero-copy-v33,
body.kls-rtl #view-print.print-pro-view .kls-print-hero-copy-v33,
#view-print.print-pro-view[dir="rtl"] .kls-print-hero-copy-v33{
  direction:rtl!important;
  unicode-bidi:plaintext!important;
  text-align:right!important;
}
html[dir="rtl"] body #view-print.print-pro-view .kls-print-hero-copy-v33 h2,
html[dir="rtl"] body #view-print.print-pro-view .kls-print-hero-copy-v33 p,
body.kls-rtl #view-print.print-pro-view .kls-print-hero-copy-v33 h2,
body.kls-rtl #view-print.print-pro-view .kls-print-hero-copy-v33 p,
#view-print.print-pro-view[dir="rtl"] .kls-print-hero-copy-v33 h2,
#view-print.print-pro-view[dir="rtl"] .kls-print-hero-copy-v33 p{
  direction:rtl!important;
  unicode-bidi:plaintext!important;
  text-align:right!important;
}

/* Shared RTL/LTR title-text correction for Activity, Security, Settings */
html body #view-activity .activity-page-head.kls-page-hero > div:first-child,
html body #view-security .security-topbar.kls-page-hero > div:first-child,
html body #view-settings .settings-pro-head.kls-page-hero > div:first-child{
  display:block!important;
  justify-content:normal!important;
  align-items:normal!important;
  min-width:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > div:first-child,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > div:first-child,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero > div:first-child,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > div:first-child,
body.kls-ltr #view-security .security-topbar.kls-page-hero > div:first-child,
#view-security[dir="ltr"] .security-topbar.kls-page-hero > div:first-child,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > div:first-child,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > div:first-child{
  direction:ltr!important;
  text-align:left!important;
  padding-inline-start:72px!important;
  padding-inline-end:0!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > div:first-child,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > div:first-child,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero > div:first-child,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > div:first-child,
body.kls-rtl #view-security .security-topbar.kls-page-hero > div:first-child,
#view-security[dir="rtl"] .security-topbar.kls-page-hero > div:first-child,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > div:first-child,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > div:first-child{
  direction:rtl!important;
  unicode-bidi:plaintext!important;
  text-align:right!important;
  padding-inline-start:0!important;
  padding-inline-end:72px!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > div:first-child h2,
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > div:first-child p,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > div:first-child h2,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > div:first-child p,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero > div:first-child h2,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero > div:first-child p,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > div:first-child h2,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > div:first-child p,
body.kls-rtl #view-security .security-topbar.kls-page-hero > div:first-child h2,
body.kls-rtl #view-security .security-topbar.kls-page-hero > div:first-child p,
#view-security[dir="rtl"] .security-topbar.kls-page-hero > div:first-child h2,
#view-security[dir="rtl"] .security-topbar.kls-page-hero > div:first-child p,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child h2,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child p,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > div:first-child h2,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > div:first-child p,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > div:first-child h2,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > div:first-child p{
  direction:rtl!important;
  unicode-bidi:plaintext!important;
  text-align:right!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > div:first-child h2,
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > div:first-child p,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > div:first-child h2,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > div:first-child p,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero > div:first-child h2,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero > div:first-child p,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > div:first-child h2,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > div:first-child p,
body.kls-ltr #view-security .security-topbar.kls-page-hero > div:first-child h2,
body.kls-ltr #view-security .security-topbar.kls-page-hero > div:first-child p,
#view-security[dir="ltr"] .security-topbar.kls-page-hero > div:first-child h2,
#view-security[dir="ltr"] .security-topbar.kls-page-hero > div:first-child p,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child h2,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child p,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > div:first-child h2,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > div:first-child p,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > div:first-child h2,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > div:first-child p{
  direction:ltr!important;
  text-align:left!important;
}

/* Physical icon side lock for Activity, Security, Settings title icons */
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > div:first-child::before,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > div:first-child::before,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero > div:first-child::before,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > div:first-child::before,
body.kls-ltr #view-security .security-topbar.kls-page-hero > div:first-child::before,
#view-security[dir="ltr"] .security-topbar.kls-page-hero > div:first-child::before,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child::before,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > div:first-child::before,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > div:first-child::before{
  left:0!important;
  right:auto!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > div:first-child::before,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > div:first-child::before,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero > div:first-child::before,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > div:first-child::before,
body.kls-rtl #view-security .security-topbar.kls-page-hero > div:first-child::before,
#view-security[dir="rtl"] .security-topbar.kls-page-hero > div:first-child::before,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child::before,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > div:first-child::before,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > div:first-child::before{
  right:0!important;
  left:auto!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > div:first-child::after,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > div:first-child::after,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero > div:first-child::after,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > div:first-child::after,
body.kls-ltr #view-security .security-topbar.kls-page-hero > div:first-child::after,
#view-security[dir="ltr"] .security-topbar.kls-page-hero > div:first-child::after,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child::after,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > div:first-child::after,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > div:first-child::after{
  left:14px!important;
  right:auto!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > div:first-child::after,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > div:first-child::after,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero > div:first-child::after,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > div:first-child::after,
body.kls-rtl #view-security .security-topbar.kls-page-hero > div:first-child::after,
#view-security[dir="rtl"] .security-topbar.kls-page-hero > div:first-child::after,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child::after,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > div:first-child::after,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > div:first-child::after{
  right:14px!important;
  left:auto!important;
}

@media(max-width:900px){
  html body #view-activity .activity-page-head.kls-page-hero > div:first-child,
  html body #view-security .security-topbar.kls-page-hero > div:first-child,
  html body #view-settings .settings-pro-head.kls-page-hero > div:first-child{
    min-height:46px!important;
  }
  html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > div:first-child,
  body.kls-ltr #view-activity .activity-page-head.kls-page-hero > div:first-child,
  #view-activity[dir="ltr"] .activity-page-head.kls-page-hero > div:first-child,
  html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > div:first-child,
  body.kls-ltr #view-security .security-topbar.kls-page-hero > div:first-child,
  #view-security[dir="ltr"] .security-topbar.kls-page-hero > div:first-child,
  html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child,
  body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > div:first-child,
  #view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > div:first-child{
    padding-inline-start:58px!important;
    padding-inline-end:0!important;
  }
  html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > div:first-child,
  body.kls-rtl #view-activity .activity-page-head.kls-page-hero > div:first-child,
  #view-activity[dir="rtl"] .activity-page-head.kls-page-hero > div:first-child,
  html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > div:first-child,
  body.kls-rtl #view-security .security-topbar.kls-page-hero > div:first-child,
  #view-security[dir="rtl"] .security-topbar.kls-page-hero > div:first-child,
  html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child,
  body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > div:first-child,
  #view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > div:first-child{
    padding-inline-start:0!important;
    padding-inline-end:58px!important;
  }
}


/* V3.0.38 — Activity / Security / Settings RTL hero icon overlap fix
   Scope: ONLY the hero/title blocks for Activity, Security, and Settings.
   Fixes the RTL issue where the headline/subtitle can slide under the pseudo icon.
   Uses a real grid layout for the generated icon box + the text so they sit next to each other. */
html body #view-activity .activity-page-head.kls-page-hero > div:first-child,
html body #view-security .security-topbar.kls-page-hero > div:first-child,
html body #view-settings .settings-pro-head.kls-page-hero > div:first-child{
  position:relative!important;
  display:grid!important;
  grid-template-rows:auto auto!important;
  align-items:center!important;
  column-gap:16px!important;
  row-gap:4px!important;
  min-height:56px!important;
  min-width:0!important;
  width:auto!important;
  max-width:min(100%, 760px)!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
  flex:0 1 auto!important;
}
html body #view-activity .activity-page-head.kls-page-hero > div:first-child::before,
html body #view-security .security-topbar.kls-page-hero > div:first-child::before,
html body #view-settings .settings-pro-head.kls-page-hero > div:first-child::before{
  content:""!important;
  position:static!important;
  grid-row:1 / span 2!important;
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  transform:none!important;
  inset:auto!important;
  align-self:center!important;
  justify-self:center!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#f7fbff,#eff7ff)!important;
  border:1px solid #cfe2f4!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
  box-sizing:border-box!important;
  z-index:1!important;
}
html body #view-activity .activity-page-head.kls-page-hero > div:first-child::after,
html body #view-security .security-topbar.kls-page-hero > div:first-child::after,
html body #view-settings .settings-pro-head.kls-page-hero > div:first-child::after{
  content:""!important;
  position:absolute!important;
  top:50%!important;
  width:22px!important;
  height:22px!important;
  transform:translateY(-50%)!important;
  background:#0e8ceb!important;
  -webkit-mask:var(--kls-title-mask) center/22px 22px no-repeat!important;
  mask:var(--kls-title-mask) center/22px 22px no-repeat!important;
  pointer-events:none!important;
  z-index:2!important;
}
html body #view-activity .activity-page-head.kls-page-hero > div:first-child h2,
html body #view-security .security-topbar.kls-page-hero > div:first-child h2,
html body #view-settings .settings-pro-head.kls-page-hero > div:first-child h2{
  grid-row:1!important;
  min-width:0!important;
  max-width:100%!important;
  margin:0!important;
  align-self:end!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  z-index:3!important;
}
html body #view-activity .activity-page-head.kls-page-hero > div:first-child p,
html body #view-security .security-topbar.kls-page-hero > div:first-child p,
html body #view-settings .settings-pro-head.kls-page-hero > div:first-child p{
  grid-row:2!important;
  min-width:0!important;
  max-width:100%!important;
  margin:0!important;
  align-self:start!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  z-index:3!important;
}
/* LTR: icon left, text right */
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > div:first-child,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > div:first-child,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero > div:first-child,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > div:first-child,
body.kls-ltr #view-security .security-topbar.kls-page-hero > div:first-child,
#view-security[dir="ltr"] .security-topbar.kls-page-hero > div:first-child,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > div:first-child,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > div:first-child{
  direction:ltr!important;
  grid-template-columns:56px minmax(0,1fr)!important;
  justify-content:start!important;
  margin-left:0!important;
  margin-right:auto!important;
  text-align:left!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > div:first-child::before,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > div:first-child::before,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero > div:first-child::before,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > div:first-child::before,
body.kls-ltr #view-security .security-topbar.kls-page-hero > div:first-child::before,
#view-security[dir="ltr"] .security-topbar.kls-page-hero > div:first-child::before,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child::before,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > div:first-child::before,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > div:first-child::before{
  grid-column:1!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > div:first-child::after,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > div:first-child::after,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero > div:first-child::after,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > div:first-child::after,
body.kls-ltr #view-security .security-topbar.kls-page-hero > div:first-child::after,
#view-security[dir="ltr"] .security-topbar.kls-page-hero > div:first-child::after,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child::after,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > div:first-child::after,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > div:first-child::after{
  left:17px!important;
  right:auto!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > div:first-child h2,
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > div:first-child p,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > div:first-child h2,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > div:first-child p,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero > div:first-child h2,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero > div:first-child p,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > div:first-child h2,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > div:first-child p,
body.kls-ltr #view-security .security-topbar.kls-page-hero > div:first-child h2,
body.kls-ltr #view-security .security-topbar.kls-page-hero > div:first-child p,
#view-security[dir="ltr"] .security-topbar.kls-page-hero > div:first-child h2,
#view-security[dir="ltr"] .security-topbar.kls-page-hero > div:first-child p,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child h2,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child p,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > div:first-child h2,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > div:first-child p,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > div:first-child h2,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > div:first-child p{
  grid-column:2!important;
  direction:ltr!important;
  text-align:left!important;
}
/* RTL: icon right, text left of icon, Arabic/Kurdish text starts from the right and never goes under icon */
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > div:first-child,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > div:first-child,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero > div:first-child,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > div:first-child,
body.kls-rtl #view-security .security-topbar.kls-page-hero > div:first-child,
#view-security[dir="rtl"] .security-topbar.kls-page-hero > div:first-child,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > div:first-child,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > div:first-child{
  direction:ltr!important;
  grid-template-columns:minmax(0,1fr) 56px!important;
  justify-content:end!important;
  margin-left:auto!important;
  margin-right:0!important;
  text-align:right!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > div:first-child::before,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > div:first-child::before,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero > div:first-child::before,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > div:first-child::before,
body.kls-rtl #view-security .security-topbar.kls-page-hero > div:first-child::before,
#view-security[dir="rtl"] .security-topbar.kls-page-hero > div:first-child::before,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child::before,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > div:first-child::before,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > div:first-child::before{
  grid-column:2!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > div:first-child::after,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > div:first-child::after,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero > div:first-child::after,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > div:first-child::after,
body.kls-rtl #view-security .security-topbar.kls-page-hero > div:first-child::after,
#view-security[dir="rtl"] .security-topbar.kls-page-hero > div:first-child::after,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child::after,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > div:first-child::after,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > div:first-child::after{
  right:17px!important;
  left:auto!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > div:first-child h2,
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > div:first-child p,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > div:first-child h2,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > div:first-child p,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero > div:first-child h2,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero > div:first-child p,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > div:first-child h2,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > div:first-child p,
body.kls-rtl #view-security .security-topbar.kls-page-hero > div:first-child h2,
body.kls-rtl #view-security .security-topbar.kls-page-hero > div:first-child p,
#view-security[dir="rtl"] .security-topbar.kls-page-hero > div:first-child h2,
#view-security[dir="rtl"] .security-topbar.kls-page-hero > div:first-child p,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child h2,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child p,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > div:first-child h2,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > div:first-child p,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > div:first-child h2,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > div:first-child p{
  grid-column:1!important;
  direction:rtl!important;
  unicode-bidi:plaintext!important;
  text-align:right!important;
}
body.theme-dark #view-activity .activity-page-head.kls-page-hero > div:first-child::before,
body.theme-dark #view-security .security-topbar.kls-page-hero > div:first-child::before,
body.theme-dark #view-settings .settings-pro-head.kls-page-hero > div:first-child::before,
.app-shell.dark #view-activity .activity-page-head.kls-page-hero > div:first-child::before,
.app-shell.dark #view-security .security-topbar.kls-page-hero > div:first-child::before,
.app-shell.dark #view-settings .settings-pro-head.kls-page-hero > div:first-child::before{
  background:#0b2032!important;
  border-color:#254866!important;
  box-shadow:none!important;
}
body.theme-dark #view-activity .activity-page-head.kls-page-hero > div:first-child::after,
body.theme-dark #view-security .security-topbar.kls-page-hero > div:first-child::after,
body.theme-dark #view-settings .settings-pro-head.kls-page-hero > div:first-child::after,
.app-shell.dark #view-activity .activity-page-head.kls-page-hero > div:first-child::after,
.app-shell.dark #view-security .security-topbar.kls-page-hero > div:first-child::after,
.app-shell.dark #view-settings .settings-pro-head.kls-page-hero > div:first-child::after{
  background:#35b7ff!important;
}
@media(max-width:900px){
  html body #view-activity .activity-page-head.kls-page-hero > div:first-child,
  html body #view-security .security-topbar.kls-page-hero > div:first-child,
  html body #view-settings .settings-pro-head.kls-page-hero > div:first-child{
    column-gap:12px!important;
    min-height:48px!important;
    width:100%!important;
    max-width:100%!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero > div:first-child::before,
  html body #view-security .security-topbar.kls-page-hero > div:first-child::before,
  html body #view-settings .settings-pro-head.kls-page-hero > div:first-child::before{
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    border-radius:16px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero > div:first-child::after,
  html body #view-security .security-topbar.kls-page-hero > div:first-child::after,
  html body #view-settings .settings-pro-head.kls-page-hero > div:first-child::after{
    width:20px!important;
    height:20px!important;
    -webkit-mask-size:20px 20px!important;
    mask-size:20px 20px!important;
  }
  html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > div:first-child,
  body.kls-ltr #view-activity .activity-page-head.kls-page-hero > div:first-child,
  #view-activity[dir="ltr"] .activity-page-head.kls-page-hero > div:first-child,
  html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > div:first-child,
  body.kls-ltr #view-security .security-topbar.kls-page-hero > div:first-child,
  #view-security[dir="ltr"] .security-topbar.kls-page-hero > div:first-child,
  html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child,
  body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > div:first-child,
  #view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > div:first-child{
    grid-template-columns:48px minmax(0,1fr)!important;
  }
  html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > div:first-child,
  body.kls-rtl #view-activity .activity-page-head.kls-page-hero > div:first-child,
  #view-activity[dir="rtl"] .activity-page-head.kls-page-hero > div:first-child,
  html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > div:first-child,
  body.kls-rtl #view-security .security-topbar.kls-page-hero > div:first-child,
  #view-security[dir="rtl"] .security-topbar.kls-page-hero > div:first-child,
  html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child,
  body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > div:first-child,
  #view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > div:first-child{
    grid-template-columns:minmax(0,1fr) 48px!important;
  }
  html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > div:first-child::after,
  body.kls-ltr #view-activity .activity-page-head.kls-page-hero > div:first-child::after,
  #view-activity[dir="ltr"] .activity-page-head.kls-page-hero > div:first-child::after,
  html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > div:first-child::after,
  body.kls-ltr #view-security .security-topbar.kls-page-hero > div:first-child::after,
  #view-security[dir="ltr"] .security-topbar.kls-page-hero > div:first-child::after,
  html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child::after,
  body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > div:first-child::after,
  #view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > div:first-child::after{
    left:14px!important;
  }
  html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > div:first-child::after,
  body.kls-rtl #view-activity .activity-page-head.kls-page-hero > div:first-child::after,
  #view-activity[dir="rtl"] .activity-page-head.kls-page-hero > div:first-child::after,
  html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > div:first-child::after,
  body.kls-rtl #view-security .security-topbar.kls-page-hero > div:first-child::after,
  #view-security[dir="rtl"] .security-topbar.kls-page-hero > div:first-child::after,
  html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > div:first-child::after,
  body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > div:first-child::after,
  #view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > div:first-child::after{
    right:14px!important;
  }
}


/* V3.0.38 — Rebuilt Activity / Security / Settings hero title blocks
   Matches the approved Users & Permissions hero title style in EN / KU / AR.
   Scope: ONLY Activity, Security, and Settings page hero title sections. */
html body #view-activity .activity-page-head.kls-page-hero,
html body #view-security .security-topbar.kls-page-hero,
html body #view-settings .settings-pro-head.kls-page-hero{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  min-height:108px!important;
  padding:20px 26px!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}

html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child{
  position:relative!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:16px!important;
  flex:1 1 auto!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:56px!important;
  margin:0!important;
  padding:0!important;
  padding-inline:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child::before,
html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child::after,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child::before,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child::after,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child::before,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child::after{
  content:none!important;
  display:none!important;
}
html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-icon,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-icon,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-icon{
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  flex:0 0 56px!important;
  margin:0!important;
  padding:0!important;
  border-radius:18px!important;
  display:grid!important;
  place-items:center!important;
  background:linear-gradient(180deg,rgba(245,251,255,.98),rgba(232,243,252,.96))!important;
  border:1px solid rgba(183,211,234,.95)!important;
  box-shadow:0 10px 24px rgba(54,121,176,.08)!important;
  color:#1f8fe5!important;
}
html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-icon svg,
html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-icon svg *,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-icon svg,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-icon svg *,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-icon svg,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-icon svg *{
  width:24px!important;
  height:24px!important;
  stroke:currentColor!important;
  fill:none!important;
  stroke-width:1.9!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:4px!important;
  flex:1 1 auto!important;
  min-width:0!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
}
html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child h2,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child h2,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child h2{
  margin:0!important;
  font-size:18px!important;
  line-height:1.2!important;
  font-weight:800!important;
  color:#102c45!important;
}
html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child p,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child p,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child p{
  margin:0!important;
  font-size:13px!important;
  line-height:1.45!important;
  color:#527089!important;
}

html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child,
body.kls-ltr #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child,
#view-security[dir="ltr"] .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child{
  direction:ltr!important;
  text-align:left!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child,
body.kls-rtl #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child,
#view-security[dir="rtl"] .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child{
  direction:rtl!important;
  text-align:right!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
body.kls-ltr #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
#view-security[dir="ltr"] .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text{
  text-align:left!important;
  align-items:flex-start!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
body.kls-rtl #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
#view-security[dir="rtl"] .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-text{
  text-align:right!important;
  align-items:flex-end!important;
}

html body #view-activity .activity-page-head.kls-page-hero > .activity-head-search,
html body #view-security .security-topbar.kls-page-hero > .button-wrap.compact,
html body #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions{
  flex:0 0 auto!important;
  min-width:0!important;
  max-width:100%!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero,
body.kls-rtl #view-security .security-topbar.kls-page-hero,
#view-security[dir="rtl"] .security-topbar.kls-page-hero,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero{
  direction:rtl!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero,
body.kls-ltr #view-security .security-topbar.kls-page-hero,
#view-security[dir="ltr"] .security-topbar.kls-page-hero,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero{
  direction:ltr!important;
}

@media (max-width:760px){
  html body #view-activity .activity-page-head.kls-page-hero,
  html body #view-security .security-topbar.kls-page-hero,
  html body #view-settings .settings-pro-head.kls-page-hero{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:12px!important;
    padding:16px!important;
    min-height:unset!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child,
  html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child,
  html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child{
    width:100%!important;
    max-width:100%!important;
    gap:12px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-icon,
  html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-icon,
  html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child .kls-hero-title-icon{
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    flex-basis:48px!important;
    border-radius:16px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child h2,
  html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child h2,
  html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child h2{
    font-size:17px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child p,
  html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child p,
  html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child p{
    font-size:12.5px!important;
    line-height:1.42!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero > .activity-head-search,
  html body #view-security .security-topbar.kls-page-hero > .button-wrap.compact,
  html body #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions{
    width:100%!important;
    max-width:100%!important;
  }
  html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > .button-wrap.compact,
  body.kls-rtl #view-security .security-topbar.kls-page-hero > .button-wrap.compact,
  #view-security[dir="rtl"] .security-topbar.kls-page-hero > .button-wrap.compact{
    display:flex!important;
    justify-content:flex-end!important;
  }
  html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > .button-wrap.compact,
  body.kls-ltr #view-security .security-topbar.kls-page-hero > .button-wrap.compact,
  #view-security[dir="ltr"] .security-topbar.kls-page-hero > .button-wrap.compact{
    display:flex!important;
    justify-content:flex-start!important;
  }
}


/* V3.0.39 — FINAL Activity / Security / Settings hero 100% match
   Scope: ONLY Activity, Security, and Settings hero title blocks.
   Goal: visually match the approved Users & Permissions hero title block exactly,
   including icon size, gap, title/subtitle scale, RTL/LTR flow, and mobile softness. */
html body #view-activity .activity-page-head.kls-page-hero,
html body #view-security .security-topbar.kls-page-hero,
html body #view-settings .settings-pro-head.kls-page-hero{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  min-height:108px!important;
  padding:20px 26px!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}

html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero,
body.kls-ltr #view-security .security-topbar.kls-page-hero,
#view-security[dir="ltr"] .security-topbar.kls-page-hero,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero{
  direction:ltr!important;
  flex-direction:row!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero,
body.kls-rtl #view-security .security-topbar.kls-page-hero,
#view-security[dir="rtl"] .security-topbar.kls-page-hero,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero{
  direction:rtl!important;
  flex-direction:row!important;
}

html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child{
  position:relative!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:16px!important;
  min-height:56px!important;
  height:auto!important;
  min-width:0!important;
  max-width:100%!important;
  flex:1 1 auto!important;
  padding:0!important;
  padding-left:0!important;
  padding-right:0!important;
  padding-inline-start:0!important;
  padding-inline-end:0!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  transform:none!important;
}
html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child::before,
html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child::after,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child::before,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child::after,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child::before,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child::after{
  content:none!important;
  display:none!important;
  position:static!important;
  inset:auto!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  width:0!important;
  height:0!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  background:none!important;
  border:0!important;
  box-shadow:none!important;
  opacity:0!important;
  transform:none!important;
  -webkit-mask:none!important;
  mask:none!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child,
body.kls-ltr #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child,
#view-security[dir="ltr"] .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child{
  direction:ltr!important;
  text-align:left!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child,
body.kls-rtl #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child,
#view-security[dir="rtl"] .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child{
  direction:rtl!important;
  text-align:right!important;
}

html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon{
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  flex:0 0 56px!important;
  order:0!important;
  margin:0!important;
  padding:0!important;
  border-radius:18px!important;
  display:grid!important;
  place-items:center!important;
  align-self:center!important;
  background:linear-gradient(180deg,#f7fbff,#eff7ff)!important;
  border:1px solid #cfe2f4!important;
  color:#0e8ceb!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
  position:relative!important;
  inset:auto!important;
  transform:none!important;
  z-index:1!important;
}
html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon svg,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon svg,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon svg{
  width:21px!important;
  height:21px!important;
  display:block!important;
  stroke:currentColor!important;
  fill:none!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:flex-start!important;
  gap:0!important;
  min-width:0!important;
  max-width:100%!important;
  flex:1 1 auto!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
body.kls-rtl #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
#view-security[dir="rtl"] .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text{
  align-items:flex-start!important;
  direction:rtl!important;
  text-align:right!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
body.kls-ltr #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
#view-security[dir="ltr"] .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text{
  align-items:flex-start!important;
  direction:ltr!important;
  text-align:left!important;
}
html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p{
  display:block!important;
  position:relative!important;
  z-index:1!important;
  max-width:100%!important;
  margin-left:0!important;
  margin-right:0!important;
  padding:0!important;
  padding-left:0!important;
  padding-right:0!important;
  padding-inline-start:0!important;
  padding-inline-end:0!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  transform:none!important;
}
html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2{
  margin-top:0!important;
  margin-bottom:7px!important;
  font-size:28px!important;
  line-height:1.08!important;
  font-weight:800!important;
  letter-spacing:-.035em!important;
  color:#071c34!important;
}
html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p{
  margin:0!important;
  font-size:15px!important;
  line-height:1.45!important;
  font-weight:500!important;
  letter-spacing:0!important;
  color:#60758e!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
body.kls-ltr #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
body.kls-ltr #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p{
  text-align:left!important;
  direction:ltr!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
body.kls-rtl #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
body.kls-rtl #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p{
  text-align:right!important;
  direction:rtl!important;
}

html body #view-activity .activity-page-head.kls-page-hero > .activity-head-search,
html body #view-security .security-topbar.kls-page-hero > .button-wrap.compact,
html body #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions{
  flex:0 0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:12px!important;
  padding:0!important;
  margin:0!important;
  min-width:0!important;
  flex-wrap:nowrap!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero > .activity-head-search,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero > .activity-head-search,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero > .activity-head-search,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero > .button-wrap.compact,
body.kls-ltr #view-security .security-topbar.kls-page-hero > .button-wrap.compact,
#view-security[dir="ltr"] .security-topbar.kls-page-hero > .button-wrap.compact,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero > .settings-pro-head-actions{
  direction:ltr!important;
  margin-left:auto!important;
  margin-right:0!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero > .activity-head-search,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero > .activity-head-search,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero > .activity-head-search,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero > .button-wrap.compact,
body.kls-rtl #view-security .security-topbar.kls-page-hero > .button-wrap.compact,
#view-security[dir="rtl"] .security-topbar.kls-page-hero > .button-wrap.compact,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero > .settings-pro-head-actions{
  direction:rtl!important;
  margin-right:auto!important;
  margin-left:0!important;
}

body.theme-dark #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon,
body.theme-dark #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon,
body.theme-dark #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon,
.app-shell.dark #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon,
.app-shell.dark #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon,
.app-shell.dark #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon{
  background:#0b2032!important;
  border-color:#254866!important;
  color:#35b7ff!important;
  box-shadow:none!important;
}
body.theme-dark #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
body.theme-dark #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
body.theme-dark #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
.app-shell.dark #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
.app-shell.dark #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
.app-shell.dark #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2{color:#f5fbff!important;}
body.theme-dark #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
body.theme-dark #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
body.theme-dark #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
.app-shell.dark #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
.app-shell.dark #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
.app-shell.dark #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p{color:#9fb5c5!important;}

@media(max-width:900px){
  html body #view-activity .activity-page-head.kls-page-hero,
  html body #view-security .security-topbar.kls-page-hero,
  html body #view-settings .settings-pro-head.kls-page-hero{
    align-items:stretch!important;
    flex-direction:column!important;
    gap:14px!important;
    min-height:auto!important;
    padding:16px 18px!important;
    border-radius:22px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child,
  html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child,
  html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child{
    min-height:46px!important;
    gap:12px!important;
    width:100%!important;
    flex:0 0 auto!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon,
  html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon,
  html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    flex-basis:46px!important;
    border-radius:15px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon svg,
  html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon svg,
  html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-icon svg{
    width:20px!important;
    height:20px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
  html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2,
  html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text h2{
    font-size:24px!important;
    margin-bottom:5px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
  html body #view-security .security-topbar.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p,
  html body #view-settings .settings-pro-head.kls-page-hero > .kls-hero-title-wrap:first-child > .kls-hero-title-text p{
    font-size:13.5px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero > .activity-head-search,
  html body #view-security .security-topbar.kls-page-hero > .button-wrap.compact,
  html body #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions{
    width:100%!important;
    justify-content:stretch!important;
    flex-wrap:wrap!important;
    gap:10px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero > .activity-head-search .activity-search-field{
    flex:1 1 100%!important;
    min-width:0!important;
    width:100%!important;
  }
  html body #view-security .security-topbar.kls-page-hero > .button-wrap.compact > .security-refresh-btn,
  html body #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions > .settings-top-action{
    flex:1 1 100%!important;
    width:100%!important;
  }
}


/* V3.0.41 — Activity page hero FULL rebuild only
   Scope: Activity hero/title block only.
   Clean structure using real icon + real text block, no pseudo icons.
   LTR: [Icon] [Title/Sub] left, search right.
   RTL: search left, [Title/Sub] [Icon] right. */
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  min-height:108px!important;
  padding:20px 26px!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero.kls-activity-hero-v40{
  direction:ltr!important;
  flex-direction:row!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero.kls-activity-hero-v40{
  direction:rtl!important;
  flex-direction:row!important;
}
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40,
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-hero-title-wrap.kls-activity-title-v40:first-child{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:16px!important;
  width:auto!important;
  min-width:0!important;
  max-width:calc(100% - 360px)!important;
  min-height:56px!important;
  flex:0 1 auto!important;
  padding:0!important;
  padding-left:0!important;
  padding-right:0!important;
  padding-inline-start:0!important;
  padding-inline-end:0!important;
  margin:0!important;
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  box-sizing:border-box!important;
  transform:none!important;
}
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40::before,
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40::after,
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-hero-title-wrap.kls-activity-title-v40:first-child::before,
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-hero-title-wrap.kls-activity-title-v40:first-child::after{
  content:none!important;
  display:none!important;
  opacity:0!important;
  width:0!important;
  height:0!important;
  min-width:0!important;
  min-height:0!important;
  position:static!important;
  inset:auto!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  transform:none!important;
  background:none!important;
  border:0!important;
  box-shadow:none!important;
  -webkit-mask:none!important;
  mask:none!important;
}
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40 > .kls-activity-title-icon-v40,
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-hero-title-wrap.kls-activity-title-v40:first-child > .kls-hero-title-icon.kls-activity-title-icon-v40{
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  flex:0 0 56px!important;
  order:0!important;
  margin:0!important;
  padding:0!important;
  border-radius:18px!important;
  display:grid!important;
  place-items:center!important;
  align-self:center!important;
  background:linear-gradient(180deg,#f7fbff,#eff7ff)!important;
  border:1px solid #cfe2f4!important;
  color:#0e8ceb!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
  position:relative!important;
  inset:auto!important;
  transform:none!important;
  z-index:1!important;
}
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-icon-v40 svg,
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-icon-v40 svg *{
  width:21px!important;
  height:21px!important;
  display:block!important;
  stroke:currentColor!important;
  fill:none!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:0!important;
  min-width:0!important;
  max-width:100%!important;
  flex:0 1 auto!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 h2,
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 p{
  display:block!important;
  position:relative!important;
  grid-column:auto!important;
  grid-row:auto!important;
  z-index:1!important;
  max-width:100%!important;
  margin-left:0!important;
  margin-right:0!important;
  padding:0!important;
  padding-left:0!important;
  padding-right:0!important;
  padding-inline-start:0!important;
  padding-inline-end:0!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  transform:none!important;
}
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 h2{
  margin-top:0!important;
  margin-bottom:7px!important;
  font-size:28px!important;
  line-height:1.08!important;
  font-weight:800!important;
  letter-spacing:-.035em!important;
  color:#071c34!important;
}
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 p{
  margin:0!important;
  font-size:15px!important;
  line-height:1.45!important;
  font-weight:500!important;
  letter-spacing:0!important;
  color:#60758e!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40{
  direction:ltr!important;
  flex-direction:row!important;
  text-align:left!important;
  margin-right:auto!important;
  margin-left:0!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40{
  direction:rtl!important;
  flex-direction:row!important;
  text-align:right!important;
  margin-right:0!important;
  margin-left:auto!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40{
  direction:ltr!important;
  text-align:left!important;
  align-items:flex-start!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40{
  direction:rtl!important;
  text-align:right!important;
  align-items:flex-start!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 h2,
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 p,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 h2,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 p,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 h2,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 p{
  direction:ltr!important;
  text-align:left!important;
  align-self:flex-start!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 h2,
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 p,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 h2,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 p,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 h2,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 p{
  direction:rtl!important;
  text-align:right!important;
  align-self:flex-start!important;
}
html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .activity-head-search{
  flex:0 0 auto!important;
  min-width:0!important;
  max-width:360px!important;
  width:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  padding:0!important;
  margin:0!important;
}
html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .activity-head-search,
body.kls-ltr #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .activity-head-search,
#view-activity[dir="ltr"] .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .activity-head-search{
  margin-left:auto!important;
  margin-right:0!important;
  direction:ltr!important;
}
html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .activity-head-search,
body.kls-rtl #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .activity-head-search,
#view-activity[dir="rtl"] .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .activity-head-search{
  margin-right:auto!important;
  margin-left:0!important;
  direction:rtl!important;
}
body.theme-dark #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-icon-v40,
.app-shell.dark #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-icon-v40{
  background:#0b2032!important;
  border-color:#254866!important;
  color:#35b7ff!important;
  box-shadow:none!important;
}
body.theme-dark #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 h2,
.app-shell.dark #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 h2{color:#f5fbff!important;}
body.theme-dark #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 p,
.app-shell.dark #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 p{color:#9fb5c5!important;}
@media(max-width:900px){
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40{
    align-items:stretch!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    gap:14px!important;
    min-height:auto!important;
    padding:16px 18px!important;
    border-radius:22px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40{
    min-height:46px!important;
    width:100%!important;
    max-width:100%!important;
    gap:12px!important;
    flex:0 0 auto!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-icon-v40{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    flex-basis:46px!important;
    border-radius:15px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-icon-v40 svg,
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-icon-v40 svg *{
    width:20px!important;
    height:20px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 h2{
    font-size:24px!important;
    margin-bottom:5px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 p{
    font-size:13.5px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .activity-head-search{
    width:100%!important;
    max-width:100%!important;
    flex:0 0 auto!important;
    justify-content:stretch!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .activity-head-search .activity-search-field{
    width:100%!important;
    max-width:100%!important;
    flex:1 1 100%!important;
  }
}

/* V3.0.41 — Activity hero mobile-only polish
   Scope: Activity page hero on mobile/tablet only.
   Desktop layout remains unchanged. */
@media (max-width: 900px){
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:14px!important;
    width:100%!important;
    max-width:100%!important;
    min-height:auto!important;
    padding:16px!important;
    box-sizing:border-box!important;
    overflow:visible!important;
  }

  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40,
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-hero-title-wrap.kls-activity-title-v40:first-child{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    flex:0 0 auto!important;
    gap:12px!important;
    min-height:52px!important;
    padding:0!important;
    margin:0!important;
    box-sizing:border-box!important;
    overflow:visible!important;
  }

  html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40,
  body.kls-ltr #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40,
  #view-activity[dir="ltr"] .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40{
    direction:ltr!important;
    flex-direction:row!important;
    text-align:left!important;
  }

  html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40,
  body.kls-rtl #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40,
  #view-activity[dir="rtl"] .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40{
    direction:rtl!important;
    flex-direction:row!important;
    text-align:right!important;
  }

  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-icon-v40,
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40 > .kls-activity-title-icon-v40,
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-hero-title-wrap.kls-activity-title-v40:first-child > .kls-hero-title-icon.kls-activity-title-icon-v40{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    flex:0 0 46px!important;
    margin:0!important;
    order:0!important;
    align-self:center!important;
  }

  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40,
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-hero-title-text.kls-activity-title-copy-v40{
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    flex:1 1 auto!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  html[dir="ltr"] body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40,
  body.kls-ltr #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40,
  #view-activity[dir="ltr"] .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40{
    direction:ltr!important;
    text-align:left!important;
    align-items:flex-start!important;
  }

  html[dir="rtl"] body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40,
  body.kls-rtl #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40,
  #view-activity[dir="rtl"] .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40{
    direction:rtl!important;
    text-align:right!important;
    align-items:flex-start!important;
  }

  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 h2,
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 p{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    text-overflow:clip!important;
    overflow:visible!important;
  }

  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 h2{
    font-size:18px!important;
    line-height:1.15!important;
    margin:0 0 4px!important;
    letter-spacing:-.02em!important;
  }

  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 p{
    font-size:11.5px!important;
    line-height:1.35!important;
    margin:0!important;
  }

  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .activity-head-search{
    width:100%!important;
    max-width:100%!important;
    flex:0 0 auto!important;
    display:flex!important;
    justify-content:stretch!important;
    margin:0!important;
  }

  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .activity-head-search .activity-search-field{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    flex:1 1 100%!important;
  }
}

@media (max-width: 480px){
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40{
    padding:14px 12px!important;
    gap:12px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40,
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-hero-title-wrap.kls-activity-title-v40:first-child{
    gap:10px!important;
    min-height:44px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-icon-v40,
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 > .kls-activity-title-v40 > .kls-activity-title-icon-v40{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    max-width:42px!important;
    flex-basis:42px!important;
    border-radius:14px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 h2{
    font-size:17px!important;
  }
  html body #view-activity .activity-page-head.kls-page-hero.kls-activity-hero-v40 .kls-activity-title-copy-v40 p{
    font-size:11px!important;
    line-height:1.3!important;
  }
}


/* V3.0.42 — Security hero FULL rebuild + mobile polish
   Scope: Security page hero/title block only.
   Matches the rebuilt Activity hero behavior using real flex rows, proper RTL/LTR,
   blue icon styling, and clean mobile stacking without narrow vertical text. */
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  min-height:108px!important;
  padding:20px 26px!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42,
body.kls-ltr #view-security .security-topbar.kls-page-hero.kls-security-hero-v42,
#view-security[dir="ltr"] .security-topbar.kls-page-hero.kls-security-hero-v42{
  direction:ltr!important;
  flex-direction:row!important;
}
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42,
body.kls-rtl #view-security .security-topbar.kls-page-hero.kls-security-hero-v42,
#view-security[dir="rtl"] .security-topbar.kls-page-hero.kls-security-hero-v42{
  direction:rtl!important;
  flex-direction:row!important;
}
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42,
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-hero-title-wrap.kls-security-title-v42:first-child{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:16px!important;
  width:auto!important;
  min-width:0!important;
  max-width:calc(100% - 220px)!important;
  min-height:56px!important;
  flex:0 1 auto!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  box-sizing:border-box!important;
  transform:none!important;
}
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42::before,
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42::after,
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-hero-title-wrap.kls-security-title-v42:first-child::before,
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-hero-title-wrap.kls-security-title-v42:first-child::after{
  content:none!important;
  display:none!important;
  opacity:0!important;
  width:0!important;
  height:0!important;
  min-width:0!important;
  min-height:0!important;
  position:static!important;
  inset:auto!important;
  background:none!important;
  border:0!important;
  box-shadow:none!important;
}
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-icon-v42{
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  flex:0 0 56px!important;
  order:0!important;
  margin:0!important;
  padding:0!important;
  border-radius:18px!important;
  display:grid!important;
  place-items:center!important;
  align-self:center!important;
  background:linear-gradient(180deg,#f7fbff,#eff7ff)!important;
  border:1px solid #cfe2f4!important;
  color:#0e8ceb!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
  position:relative!important;
  inset:auto!important;
  transform:none!important;
  z-index:1!important;
}
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-icon-v42 svg,
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-icon-v42 svg *{
  width:21px!important;
  height:21px!important;
  display:block!important;
  stroke:currentColor!important;
  fill:none!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:0!important;
  min-width:0!important;
  max-width:100%!important;
  flex:0 1 auto!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 h2,
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 p{
  display:block!important;
  position:relative!important;
  z-index:1!important;
  max-width:100%!important;
  margin-left:0!important;
  margin-right:0!important;
  padding:0!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  transform:none!important;
}
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 h2{
  margin-top:0!important;
  margin-bottom:7px!important;
  font-size:28px!important;
  line-height:1.08!important;
  font-weight:800!important;
  letter-spacing:-.035em!important;
  color:#071c34!important;
}
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 p{
  margin:0!important;
  font-size:15px!important;
  line-height:1.45!important;
  font-weight:500!important;
  letter-spacing:0!important;
  color:#60758e!important;
}
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42,
body.kls-ltr #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42,
#view-security[dir="ltr"] .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42{
  direction:ltr!important;
  flex-direction:row!important;
  text-align:left!important;
  margin-right:auto!important;
  margin-left:0!important;
}
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42,
body.kls-rtl #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42,
#view-security[dir="rtl"] .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42{
  direction:rtl!important;
  flex-direction:row!important;
  text-align:right!important;
  margin-right:0!important;
  margin-left:auto!important;
}
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42,
body.kls-ltr #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42,
#view-security[dir="ltr"] .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42{
  direction:ltr!important;
  text-align:left!important;
  align-items:flex-start!important;
}
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42,
body.kls-rtl #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42,
#view-security[dir="rtl"] .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42{
  direction:rtl!important;
  text-align:right!important;
  align-items:flex-start!important;
}
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 h2,
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 p,
body.kls-ltr #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 h2,
body.kls-ltr #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 p,
#view-security[dir="ltr"] .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 h2,
#view-security[dir="ltr"] .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 p{
  direction:ltr!important;
  text-align:left!important;
  align-self:flex-start!important;
}
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 h2,
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 p,
body.kls-rtl #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 h2,
body.kls-rtl #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 p,
#view-security[dir="rtl"] .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 h2,
#view-security[dir="rtl"] .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 p{
  direction:rtl!important;
  text-align:right!important;
  align-self:flex-start!important;
}
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-actions-v42{
  flex:0 0 auto!important;
  min-width:0!important;
  max-width:220px!important;
  width:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  padding:0!important;
  margin:0!important;
  gap:0!important;
}
html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-actions-v42 > .security-refresh-btn{
  min-height:48px!important;
  padding:0 18px!important;
  border-radius:16px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
}
html[dir="ltr"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-actions-v42,
body.kls-ltr #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-actions-v42,
#view-security[dir="ltr"] .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-actions-v42{
  margin-left:auto!important;
  margin-right:0!important;
  direction:ltr!important;
}
html[dir="rtl"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-actions-v42,
body.kls-rtl #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-actions-v42,
#view-security[dir="rtl"] .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-actions-v42{
  margin-right:auto!important;
  margin-left:0!important;
  direction:rtl!important;
}
body.theme-dark #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-icon-v42,
.app-shell.dark #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-icon-v42{
  background:#0b2032!important;
  border-color:#254866!important;
  color:#35b7ff!important;
  box-shadow:none!important;
}
body.theme-dark #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 h2,
.app-shell.dark #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 h2{color:#f5fbff!important;}
body.theme-dark #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 p,
.app-shell.dark #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 p{color:#9fb5c5!important;}
@media (max-width: 900px){
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:14px!important;
    width:100%!important;
    max-width:100%!important;
    min-height:auto!important;
    padding:16px!important;
    box-sizing:border-box!important;
    overflow:visible!important;
    border-radius:22px!important;
  }
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42,
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-hero-title-wrap.kls-security-title-v42:first-child{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    flex:0 0 auto!important;
    gap:12px!important;
    min-height:52px!important;
    padding:0!important;
    margin:0!important;
    box-sizing:border-box!important;
    overflow:visible!important;
  }
  html[dir="ltr"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42,
  body.kls-ltr #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42,
  #view-security[dir="ltr"] .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42{
    direction:ltr!important;
    flex-direction:row!important;
    text-align:left!important;
  }
  html[dir="rtl"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42,
  body.kls-rtl #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42,
  #view-security[dir="rtl"] .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42{
    direction:rtl!important;
    flex-direction:row!important;
    text-align:right!important;
  }
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-icon-v42{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    flex:0 0 46px!important;
    margin:0!important;
    order:0!important;
    align-self:center!important;
    border-radius:15px!important;
  }
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-icon-v42 svg,
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-icon-v42 svg *{
    width:20px!important;
    height:20px!important;
  }
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42{
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    flex:1 1 auto!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  html[dir="ltr"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42,
  body.kls-ltr #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42,
  #view-security[dir="ltr"] .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42{
    direction:ltr!important;
    text-align:left!important;
    align-items:flex-start!important;
  }
  html[dir="rtl"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42,
  body.kls-rtl #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42,
  #view-security[dir="rtl"] .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42{
    direction:rtl!important;
    text-align:right!important;
    align-items:flex-start!important;
  }
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 h2,
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 p{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    text-overflow:clip!important;
    overflow:visible!important;
  }
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 h2{
    font-size:18px!important;
    line-height:1.15!important;
    margin:0 0 4px!important;
    letter-spacing:-.02em!important;
  }
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 p{
    font-size:11.5px!important;
    line-height:1.35!important;
    margin:0!important;
  }
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-actions-v42{
    width:100%!important;
    max-width:100%!important;
    flex:0 0 auto!important;
    display:flex!important;
    margin:0!important;
  }
  html[dir="ltr"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-actions-v42,
  body.kls-ltr #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-actions-v42,
  #view-security[dir="ltr"] .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-actions-v42{
    justify-content:flex-start!important;
  }
  html[dir="rtl"] body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-actions-v42,
  body.kls-rtl #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-actions-v42,
  #view-security[dir="rtl"] .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-actions-v42{
    justify-content:flex-end!important;
  }
}
@media (max-width: 480px){
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42{
    padding:14px 12px!important;
    gap:12px!important;
  }
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-title-v42,
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-hero-title-wrap.kls-security-title-v42:first-child{
    gap:10px!important;
    min-height:44px!important;
  }
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-icon-v42{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    max-width:42px!important;
    flex-basis:42px!important;
    border-radius:14px!important;
  }
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 h2{
    font-size:17px!important;
  }
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 .kls-security-title-copy-v42 p{
    font-size:11px!important;
    line-height:1.3!important;
  }
  html body #view-security .security-topbar.kls-page-hero.kls-security-hero-v42 > .kls-security-actions-v42 > .security-refresh-btn{
    min-height:44px!important;
    padding:0 16px!important;
  }
}


/* V3.0.43 — Settings hero FULL rebuild + same blue icon color */
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  min-height:108px!important;
  padding:20px 26px!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43{
  direction:ltr!important;
  flex-direction:row!important;
}
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43{
  direction:rtl!important;
  flex-direction:row!important;
}
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43,
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-hero-title-wrap.kls-settings-title-v43:first-child{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:16px!important;
  width:auto!important;
  min-width:0!important;
  max-width:calc(100% - 320px)!important;
  min-height:56px!important;
  flex:0 1 auto!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  box-sizing:border-box!important;
  transform:none!important;
}
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43::before,
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43::after,
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-hero-title-wrap.kls-settings-title-v43:first-child::before,
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-hero-title-wrap.kls-settings-title-v43:first-child::after{
  content:none!important;
  display:none!important;
  opacity:0!important;
  width:0!important;
  height:0!important;
  min-width:0!important;
  min-height:0!important;
  position:static!important;
  inset:auto!important;
  background:none!important;
  border:0!important;
  box-shadow:none!important;
}
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-icon-v43{
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  flex:0 0 56px!important;
  order:0!important;
  margin:0!important;
  padding:0!important;
  border-radius:18px!important;
  display:grid!important;
  place-items:center!important;
  align-self:center!important;
  background:linear-gradient(180deg,#f7fbff,#eff7ff)!important;
  border:1px solid #cfe2f4!important;
  color:#0e8ceb!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
  position:relative!important;
  inset:auto!important;
  transform:none!important;
  z-index:1!important;
}
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-icon-v43 svg,
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-icon-v43 svg *{
  width:21px!important;
  height:21px!important;
  display:block!important;
  stroke:currentColor!important;
  fill:none!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:0!important;
  min-width:0!important;
  max-width:100%!important;
  flex:0 1 auto!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 h2,
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 p{
  display:block!important;
  position:relative!important;
  z-index:1!important;
  max-width:100%!important;
  margin-left:0!important;
  margin-right:0!important;
  padding:0!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  transform:none!important;
}
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 h2{
  margin-top:0!important;
  margin-bottom:7px!important;
  font-size:28px!important;
  line-height:1.08!important;
  font-weight:800!important;
  letter-spacing:-.035em!important;
  color:#071c34!important;
}
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 p{
  margin:0!important;
  font-size:15px!important;
  line-height:1.45!important;
  font-weight:500!important;
  letter-spacing:0!important;
  color:#60758e!important;
}
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43{
  direction:ltr!important;
  flex-direction:row!important;
  text-align:left!important;
  margin-right:auto!important;
  margin-left:0!important;
}
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43{
  direction:rtl!important;
  flex-direction:row!important;
  text-align:right!important;
  margin-right:0!important;
  margin-left:auto!important;
}
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43{
  direction:ltr!important;
  text-align:left!important;
  align-items:flex-start!important;
}
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43{
  direction:rtl!important;
  text-align:right!important;
  align-items:flex-start!important;
}
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 h2,
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 p,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 h2,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 p,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 h2,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 p{
  direction:ltr!important;
  text-align:left!important;
  align-self:flex-start!important;
}
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 h2,
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 p,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 h2,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 p,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 h2,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 p{
  direction:rtl!important;
  text-align:right!important;
  align-self:flex-start!important;
}
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43{
  flex:0 0 auto!important;
  min-width:0!important;
  max-width:320px!important;
  width:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:12px!important;
  padding:0!important;
  margin:0!important;
}
html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43 > .settings-top-action{
  min-height:48px!important;
  padding:0 18px!important;
  border-radius:16px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
}
html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43,
body.kls-ltr #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43,
#view-settings[dir="ltr"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43{
  margin-left:auto!important;
  margin-right:0!important;
  direction:ltr!important;
}
html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43,
body.kls-rtl #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43,
#view-settings[dir="rtl"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43{
  margin-right:auto!important;
  margin-left:0!important;
  direction:rtl!important;
}
body.theme-dark #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-icon-v43,
.app-shell.dark #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-icon-v43{
  background:#0b2032!important;
  border-color:#254866!important;
  color:#35b7ff!important;
  box-shadow:none!important;
}
body.theme-dark #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 h2,
.app-shell.dark #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 h2{color:#f5fbff!important;}
body.theme-dark #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 p,
.app-shell.dark #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 p{color:#9fb5c5!important;}
@media (max-width: 980px){
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:14px!important;
    width:100%!important;
    max-width:100%!important;
    min-height:auto!important;
    padding:16px!important;
    box-sizing:border-box!important;
    overflow:visible!important;
    border-radius:22px!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43,
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-hero-title-wrap.kls-settings-title-v43:first-child{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    flex:0 0 auto!important;
    gap:12px!important;
    min-height:52px!important;
    padding:0!important;
    margin:0!important;
    box-sizing:border-box!important;
    overflow:visible!important;
  }
  html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43,
  body.kls-ltr #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43,
  #view-settings[dir="ltr"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43{
    direction:ltr!important;
    flex-direction:row!important;
    text-align:left!important;
  }
  html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43,
  body.kls-rtl #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43,
  #view-settings[dir="rtl"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43{
    direction:rtl!important;
    flex-direction:row!important;
    text-align:right!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-icon-v43{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    flex:0 0 46px!important;
    margin:0!important;
    order:0!important;
    align-self:center!important;
    border-radius:15px!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-icon-v43 svg,
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-icon-v43 svg *{
    width:20px!important;
    height:20px!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43{
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    flex:1 1 auto!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43,
  body.kls-ltr #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43,
  #view-settings[dir="ltr"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43{
    direction:ltr!important;
    text-align:left!important;
    align-items:flex-start!important;
  }
  html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43,
  body.kls-rtl #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43,
  #view-settings[dir="rtl"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43{
    direction:rtl!important;
    text-align:right!important;
    align-items:flex-start!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 h2,
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 p{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    text-overflow:clip!important;
    overflow:visible!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 h2{
    font-size:18px!important;
    line-height:1.15!important;
    margin:0 0 4px!important;
    letter-spacing:-.02em!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 p{
    font-size:11.5px!important;
    line-height:1.35!important;
    margin:0!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43{
    width:100%!important;
    max-width:100%!important;
    flex:0 0 auto!important;
    display:flex!important;
    flex-wrap:wrap!important;
    gap:10px!important;
    margin:0!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43 > .settings-top-action{
    flex:1 1 180px!important;
  }
  html[dir="ltr"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43,
  body.kls-ltr #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43,
  #view-settings[dir="ltr"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43{
    justify-content:flex-start!important;
  }
  html[dir="rtl"] body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43,
  body.kls-rtl #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43,
  #view-settings[dir="rtl"] .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43{
    justify-content:flex-end!important;
  }
}
@media (max-width: 480px){
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43{
    padding:14px 12px!important;
    gap:12px!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-title-v43,
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-hero-title-wrap.kls-settings-title-v43:first-child{
    gap:10px!important;
    min-height:44px!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-icon-v43{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    max-width:42px!important;
    flex-basis:42px!important;
    border-radius:14px!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 h2{
    font-size:17px!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 .kls-settings-title-copy-v43 p{
    font-size:11px!important;
    line-height:1.3!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero.kls-settings-hero-v43 > .kls-settings-actions-v43 > .settings-top-action{
    min-height:44px!important;
    padding:0 14px!important;
    flex:1 1 100%!important;
  }
}

/* V3.0.44 — HARD CSS: Hero Title Icon Blue Lock
   Scope ONLY: Print Center, Security, Settings hero title icons.
   Desktop + Mobile. No layout changes. */
:root{
  --kls-hero-icon-hard-blue:#0e8ceb;
  --kls-hero-icon-hard-blue-dark:#35b7ff;
}
html body #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon,
html body #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon.kls-hero-title-icon,
html body #view-security .security-topbar.kls-page-hero .security-hero-title-icon,
html body #view-security .security-topbar.kls-page-hero .kls-security-title-icon-v42,
html body #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .settings-hero-title-icon,
html body #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .kls-settings-title-icon-v43{
  color:var(--kls-hero-icon-hard-blue)!important;
}
html body #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon svg,
html body #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon svg *,
html body #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon .kls-ui-icon,
html body #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon .kls-ui-icon *,
html body #view-security .security-topbar.kls-page-hero .security-hero-title-icon svg,
html body #view-security .security-topbar.kls-page-hero .security-hero-title-icon svg *,
html body #view-security .security-topbar.kls-page-hero .security-hero-title-icon .kls-ui-icon,
html body #view-security .security-topbar.kls-page-hero .security-hero-title-icon .kls-ui-icon *,
html body #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .settings-hero-title-icon svg,
html body #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .settings-hero-title-icon svg *,
html body #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .settings-hero-title-icon .kls-ui-icon,
html body #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .settings-hero-title-icon .kls-ui-icon *{
  color:var(--kls-hero-icon-hard-blue)!important;
  stroke:var(--kls-hero-icon-hard-blue)!important;
  fill:none!important;
}
body.theme-dark #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon,
.app-shell.dark #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon,
body.theme-dark #view-security .security-topbar.kls-page-hero .security-hero-title-icon,
.app-shell.dark #view-security .security-topbar.kls-page-hero .security-hero-title-icon,
body.theme-dark #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .settings-hero-title-icon,
.app-shell.dark #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .settings-hero-title-icon{
  color:var(--kls-hero-icon-hard-blue-dark)!important;
}
body.theme-dark #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon svg,
body.theme-dark #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon svg *,
.app-shell.dark #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon svg,
.app-shell.dark #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon svg *,
body.theme-dark #view-security .security-topbar.kls-page-hero .security-hero-title-icon svg,
body.theme-dark #view-security .security-topbar.kls-page-hero .security-hero-title-icon svg *,
.app-shell.dark #view-security .security-topbar.kls-page-hero .security-hero-title-icon svg,
.app-shell.dark #view-security .security-topbar.kls-page-hero .security-hero-title-icon svg *,
body.theme-dark #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .settings-hero-title-icon svg,
body.theme-dark #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .settings-hero-title-icon svg *,
.app-shell.dark #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .settings-hero-title-icon svg,
.app-shell.dark #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .settings-hero-title-icon svg *{
  color:var(--kls-hero-icon-hard-blue-dark)!important;
  stroke:var(--kls-hero-icon-hard-blue-dark)!important;
  fill:none!important;
}
@media(max-width:900px){
  html body #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon,
  html body #view-security .security-topbar.kls-page-hero .security-hero-title-icon,
  html body #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .settings-hero-title-icon{
    color:var(--kls-hero-icon-hard-blue)!important;
  }
  html body #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon svg,
  html body #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon svg *,
  html body #view-security .security-topbar.kls-page-hero .security-hero-title-icon svg,
  html body #view-security .security-topbar.kls-page-hero .security-hero-title-icon svg *,
  html body #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .settings-hero-title-icon svg,
  html body #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .settings-hero-title-icon svg *{
    color:var(--kls-hero-icon-hard-blue)!important;
    stroke:var(--kls-hero-icon-hard-blue)!important;
    fill:none!important;
  }
}


/* V3.0.45 — ABSOLUTE HARD BLUE ICON OVERRIDE
   Scope ONLY: hero title icons for Print Center, Security, Settings.
   Desktop + mobile. No layout, spacing, or RTL/LTR changes. */
:root{
  --kls-force-hero-icon-blue:#0e8ceb!important;
  --kls-force-hero-icon-blue-dark:#35b7ff!important;
}

/* Force the three icon CONTAINERS to use the same approved blue color token */
html body #view-print.print-pro-view .kls-print-hero-icon-v33,
html body #view-print.print-pro-view .print-page-title-icon,
html body #view-print.print-pro-view .print-pro-head.kls-page-hero .kls-print-hero-icon-v33,
html body #view-print.print-pro-view .print-pro-head.kls-page-hero .print-page-title-icon,
html body #view-security .security-topbar.kls-page-hero .kls-security-title-icon-v42,
html body #view-security .security-topbar.kls-page-hero .security-hero-title-icon,
html body #view-security .security-topbar.kls-page-hero .kls-hero-title-icon,
html body #view-settings .settings-pro-head.kls-page-hero .kls-settings-title-icon-v43,
html body #view-settings .settings-pro-head.kls-page-hero .settings-hero-title-icon,
html body #view-settings .settings-pro-head.kls-page-hero .kls-hero-title-icon,
html body #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .kls-settings-title-icon-v43,
html body #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .settings-hero-title-icon,
html body #view-settings.settings-pro-view .settings-pro-head.kls-page-hero .kls-hero-title-icon{
  color:#0e8ceb!important;
  background:linear-gradient(180deg,#f7fbff,#eff7ff)!important;
  border-color:#cfe2f4!important;
}

/* Force every SVG layer in those icons to blue — this overrides currentColor, grey variables, and old sidebar icon rules */
html body #view-print.print-pro-view .kls-print-hero-icon-v33 svg,
html body #view-print.print-pro-view .kls-print-hero-icon-v33 svg *,
html body #view-print.print-pro-view .print-page-title-icon svg,
html body #view-print.print-pro-view .print-page-title-icon svg *,
html body #view-security .security-topbar.kls-page-hero .kls-security-title-icon-v42 svg,
html body #view-security .security-topbar.kls-page-hero .kls-security-title-icon-v42 svg *,
html body #view-security .security-topbar.kls-page-hero .security-hero-title-icon svg,
html body #view-security .security-topbar.kls-page-hero .security-hero-title-icon svg *,
html body #view-security .security-topbar.kls-page-hero .kls-hero-title-icon svg,
html body #view-security .security-topbar.kls-page-hero .kls-hero-title-icon svg *,
html body #view-settings .settings-pro-head.kls-page-hero .kls-settings-title-icon-v43 svg,
html body #view-settings .settings-pro-head.kls-page-hero .kls-settings-title-icon-v43 svg *,
html body #view-settings .settings-pro-head.kls-page-hero .settings-hero-title-icon svg,
html body #view-settings .settings-pro-head.kls-page-hero .settings-hero-title-icon svg *,
html body #view-settings .settings-pro-head.kls-page-hero .kls-hero-title-icon svg,
html body #view-settings .settings-pro-head.kls-page-hero .kls-hero-title-icon svg *{
  color:#0e8ceb!important;
  stroke:#0e8ceb!important;
}

/* Preserve outline icon look for Lucide-style SVGs */
html body #view-print.print-pro-view .kls-print-hero-icon-v33 svg path,
html body #view-print.print-pro-view .print-page-title-icon svg path,
html body #view-security .security-topbar.kls-page-hero .kls-security-title-icon-v42 svg path,
html body #view-security .security-topbar.kls-page-hero .security-hero-title-icon svg path,
html body #view-security .security-topbar.kls-page-hero .kls-hero-title-icon svg path,
html body #view-settings .settings-pro-head.kls-page-hero .kls-settings-title-icon-v43 svg path,
html body #view-settings .settings-pro-head.kls-page-hero .settings-hero-title-icon svg path,
html body #view-settings .settings-pro-head.kls-page-hero .kls-hero-title-icon svg path,
html body #view-settings .settings-pro-head.kls-page-hero .kls-settings-title-icon-v43 svg circle,
html body #view-settings .settings-pro-head.kls-page-hero .settings-hero-title-icon svg circle,
html body #view-settings .settings-pro-head.kls-page-hero .kls-hero-title-icon svg circle{
  stroke:#0e8ceb!important;
  fill:none!important;
}

/* Dark mode: same hard lock, using the approved bright blue */
body.theme-dark #view-print.print-pro-view .kls-print-hero-icon-v33,
body.theme-dark #view-print.print-pro-view .print-page-title-icon,
body.theme-dark #view-security .security-topbar.kls-page-hero .kls-security-title-icon-v42,
body.theme-dark #view-security .security-topbar.kls-page-hero .security-hero-title-icon,
body.theme-dark #view-settings .settings-pro-head.kls-page-hero .kls-settings-title-icon-v43,
body.theme-dark #view-settings .settings-pro-head.kls-page-hero .settings-hero-title-icon,
.app-shell.dark #view-print.print-pro-view .kls-print-hero-icon-v33,
.app-shell.dark #view-print.print-pro-view .print-page-title-icon,
.app-shell.dark #view-security .security-topbar.kls-page-hero .kls-security-title-icon-v42,
.app-shell.dark #view-security .security-topbar.kls-page-hero .security-hero-title-icon,
.app-shell.dark #view-settings .settings-pro-head.kls-page-hero .kls-settings-title-icon-v43,
.app-shell.dark #view-settings .settings-pro-head.kls-page-hero .settings-hero-title-icon{
  color:#35b7ff!important;
}
body.theme-dark #view-print.print-pro-view .kls-print-hero-icon-v33 svg,
body.theme-dark #view-print.print-pro-view .kls-print-hero-icon-v33 svg *,
body.theme-dark #view-print.print-pro-view .print-page-title-icon svg,
body.theme-dark #view-print.print-pro-view .print-page-title-icon svg *,
body.theme-dark #view-security .security-topbar.kls-page-hero .kls-security-title-icon-v42 svg,
body.theme-dark #view-security .security-topbar.kls-page-hero .kls-security-title-icon-v42 svg *,
body.theme-dark #view-security .security-topbar.kls-page-hero .security-hero-title-icon svg,
body.theme-dark #view-security .security-topbar.kls-page-hero .security-hero-title-icon svg *,
body.theme-dark #view-settings .settings-pro-head.kls-page-hero .kls-settings-title-icon-v43 svg,
body.theme-dark #view-settings .settings-pro-head.kls-page-hero .kls-settings-title-icon-v43 svg *,
body.theme-dark #view-settings .settings-pro-head.kls-page-hero .settings-hero-title-icon svg,
body.theme-dark #view-settings .settings-pro-head.kls-page-hero .settings-hero-title-icon svg *,
.app-shell.dark #view-print.print-pro-view .kls-print-hero-icon-v33 svg,
.app-shell.dark #view-print.print-pro-view .kls-print-hero-icon-v33 svg *,
.app-shell.dark #view-print.print-pro-view .print-page-title-icon svg,
.app-shell.dark #view-print.print-pro-view .print-page-title-icon svg *,
.app-shell.dark #view-security .security-topbar.kls-page-hero .kls-security-title-icon-v42 svg,
.app-shell.dark #view-security .security-topbar.kls-page-hero .kls-security-title-icon-v42 svg *,
.app-shell.dark #view-security .security-topbar.kls-page-hero .security-hero-title-icon svg,
.app-shell.dark #view-security .security-topbar.kls-page-hero .security-hero-title-icon svg *,
.app-shell.dark #view-settings .settings-pro-head.kls-page-hero .kls-settings-title-icon-v43 svg,
.app-shell.dark #view-settings .settings-pro-head.kls-page-hero .kls-settings-title-icon-v43 svg *,
.app-shell.dark #view-settings .settings-pro-head.kls-page-hero .settings-hero-title-icon svg,
.app-shell.dark #view-settings .settings-pro-head.kls-page-hero .settings-hero-title-icon svg *{
  color:#35b7ff!important;
  stroke:#35b7ff!important;
}


/* V3.0.46 — HARD collapsed sidebar icon center fix
   Scope: collapsed sidebar only. Keeps expanded sidebar RTL/LTR unchanged.
   EN/KU/AR: icons stay exactly centered inside the collapsed menu buttons. */
@media (min-width:901px){
  html body.sidebar-collapsed #app.app-shell #appSidebar .nav-grid,
  html[dir="ltr"] body.sidebar-collapsed #app.app-shell #appSidebar .nav-grid,
  html[dir="rtl"] body.sidebar-collapsed #app.app-shell #appSidebar .nav-grid{
    direction:ltr!important;
    display:grid!important;
    justify-items:center!important;
    align-items:start!important;
    padding-left:0!important;
    padding-right:0!important;
    padding-inline-start:0!important;
    padding-inline-end:0!important;
    width:100%!important;
    box-sizing:border-box!important;
  }
  html body.sidebar-collapsed #app.app-shell #appSidebar .nav-btn,
  html[dir="ltr"] body.sidebar-collapsed #app.app-shell #appSidebar .nav-btn,
  html[dir="rtl"] body.sidebar-collapsed #app.app-shell #appSidebar .nav-btn{
    direction:ltr!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:center!important;
    justify-items:center!important;
    text-align:center!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin-left:auto!important;
    margin-right:auto!important;
    margin-inline:auto!important;
    padding-left:0!important;
    padding-right:0!important;
    padding-inline-start:0!important;
    padding-inline-end:0!important;
    gap:0!important;
    box-sizing:border-box!important;
  }
  html body.sidebar-collapsed #app.app-shell #appSidebar .nav-btn .nav-icon,
  html[dir="ltr"] body.sidebar-collapsed #app.app-shell #appSidebar .nav-btn .nav-icon,
  html[dir="rtl"] body.sidebar-collapsed #app.app-shell #appSidebar .nav-btn .nav-icon,
  html body.sidebar-collapsed #app.app-shell #appSidebar .nav-btn .nav-icon-img,
  html[dir="ltr"] body.sidebar-collapsed #app.app-shell #appSidebar .nav-btn .nav-icon-img,
  html[dir="rtl"] body.sidebar-collapsed #app.app-shell #appSidebar .nav-btn .nav-icon-img{
    order:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex:0 0 auto!important;
    width:22px!important;
    height:22px!important;
    min-width:22px!important;
    max-width:22px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    margin-inline-start:auto!important;
    margin-inline-end:auto!important;
    transform:none!important;
    position:relative!important;
    left:auto!important;
    right:auto!important;
    inset-inline-start:auto!important;
    inset-inline-end:auto!important;
  }
  html body.sidebar-collapsed #app.app-shell #appSidebar .nav-btn .nav-icon svg,
  html[dir="ltr"] body.sidebar-collapsed #app.app-shell #appSidebar .nav-btn .nav-icon svg,
  html[dir="rtl"] body.sidebar-collapsed #app.app-shell #appSidebar .nav-btn .nav-icon svg{
    display:block!important;
    width:20px!important;
    height:20px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    margin-inline:auto!important;
    transform:none!important;
    position:static!important;
  }
  html body.sidebar-collapsed #app.app-shell #appSidebar .nav-btn .nav-label,
  html[dir="ltr"] body.sidebar-collapsed #app.app-shell #appSidebar .nav-btn .nav-label,
  html[dir="rtl"] body.sidebar-collapsed #app.app-shell #appSidebar .nav-btn .nav-label{
    display:none!important;
    width:0!important;
    max-width:0!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
  }
  html[dir="rtl"] body.sidebar-collapsed #app.app-shell #appSidebar .nav-btn::after{
    left:calc(100% + 12px)!important;
    right:auto!important;
    inset-inline-start:auto!important;
    inset-inline-end:auto!important;
  }
}


/* V3.0.48 — Dashboard RTL filter caret position fix ONLY
   Scope: dashboard filter caret icons (.kls-ui-icon.dash-caret) only.
   Kurdish/Arabic RTL: caret must stay on the RIGHT side of the filter button.
   English/LTR remains unchanged with caret on the right side as already approved. */
html[dir="rtl"] body #view-dashboard.dashboard-pro-view .dash-filter-btn,
body.kls-rtl #view-dashboard.dashboard-pro-view .dash-filter-btn,
#app.kls-rtl #view-dashboard.dashboard-pro-view .dash-filter-btn,
#view-dashboard.dashboard-pro-view[dir="rtl"] .dash-filter-btn{
  direction:rtl!important;
  flex-direction:row!important;
}
html[dir="rtl"] body #view-dashboard.dashboard-pro-view .dash-filter-btn > .dash-caret,
body.kls-rtl #view-dashboard.dashboard-pro-view .dash-filter-btn > .dash-caret,
#app.kls-rtl #view-dashboard.dashboard-pro-view .dash-filter-btn > .dash-caret,
#view-dashboard.dashboard-pro-view[dir="rtl"] .dash-filter-btn > .dash-caret,
html[dir="rtl"] body #view-dashboard.dashboard-pro-view .dash-filter-btn > svg.kls-ui-icon.dash-caret,
body.kls-rtl #view-dashboard.dashboard-pro-view .dash-filter-btn > svg.kls-ui-icon.dash-caret,
#app.kls-rtl #view-dashboard.dashboard-pro-view .dash-filter-btn > svg.kls-ui-icon.dash-caret,
#view-dashboard.dashboard-pro-view[dir="rtl"] .dash-filter-btn > svg.kls-ui-icon.dash-caret{
  order:-10!important;
  margin-inline-start:0!important;
  margin-inline-end:0!important;
  margin-left:8px!important;
  margin-right:0!important;
  align-self:center!important;
  flex:0 0 17px!important;
}
html[dir="rtl"] body #view-dashboard.dashboard-pro-view .dash-filter-btn > span,
body.kls-rtl #view-dashboard.dashboard-pro-view .dash-filter-btn > span,
#app.kls-rtl #view-dashboard.dashboard-pro-view .dash-filter-btn > span,
#view-dashboard.dashboard-pro-view[dir="rtl"] .dash-filter-btn > span{
  order:0!important;
}
html[dir="rtl"] body #view-dashboard.dashboard-pro-view .dash-filter-btn > svg.kls-ui-icon:not(.dash-caret),
body.kls-rtl #view-dashboard.dashboard-pro-view .dash-filter-btn > svg.kls-ui-icon:not(.dash-caret),
#app.kls-rtl #view-dashboard.dashboard-pro-view .dash-filter-btn > svg.kls-ui-icon:not(.dash-caret),
#view-dashboard.dashboard-pro-view[dir="rtl"] .dash-filter-btn > svg.kls-ui-icon:not(.dash-caret){
  order:10!important;
  margin-inline-start:auto!important;
  margin-inline-end:0!important;
  margin-left:0!important;
  margin-right:auto!important;
}
html[dir="ltr"] body #view-dashboard.dashboard-pro-view .dash-filter-btn > .dash-caret,
body.kls-ltr #view-dashboard.dashboard-pro-view .dash-filter-btn > .dash-caret,
#app.kls-ltr #view-dashboard.dashboard-pro-view .dash-filter-btn > .dash-caret,
#view-dashboard.dashboard-pro-view[dir="ltr"] .dash-filter-btn > .dash-caret{
  order:10!important;
  margin-inline-start:auto!important;
  margin-inline-end:0!important;
  margin-left:auto!important;
  margin-right:0!important;
}
@media (max-width:900px){
  html[dir="rtl"] body #view-dashboard.dashboard-pro-view .dash-filter-btn > .dash-caret,
  body.kls-rtl #view-dashboard.dashboard-pro-view .dash-filter-btn > .dash-caret,
  #app.kls-rtl #view-dashboard.dashboard-pro-view .dash-filter-btn > .dash-caret,
  #view-dashboard.dashboard-pro-view[dir="rtl"] .dash-filter-btn > .dash-caret{
    order:-10!important;
    margin-inline-start:0!important;
    margin-inline-end:0!important;
    margin-left:8px!important;
    margin-right:0!important;
  }
}

/* V3.0.48 — Mobile RTL notification dropdown center fix ONLY
   Scope: notification panel on mobile for Kurdish/Arabic. English desktop/mobile stays unchanged. */
@media (max-width:900px), (hover:none) and (pointer:coarse){
  html[dir="rtl"] .notification-wrap,
  body.kls-rtl .notification-wrap,
  #app.kls-rtl .notification-wrap{
    position:static!important;
    overflow:visible!important;
  }
  html[dir="rtl"] .notification-panel,
  body.kls-rtl .notification-panel,
  #app.kls-rtl .notification-panel{
    position:fixed!important;
    top:calc(112px + env(safe-area-inset-top,0px))!important;
    left:50%!important;
    right:auto!important;
    transform:translate3d(-50%,0,0)!important;
    width:min(368px,calc(100vw - 20px))!important;
    min-width:0!important;
    max-width:calc(100vw - 20px)!important;
    max-height:calc(100svh - 132px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important;
    margin:0!important;
    z-index:10050!important;
    box-sizing:border-box!important;
    text-align:right!important;
    direction:rtl!important;
    overflow:hidden!important;
  }
  html[dir="rtl"] .notification-panel::before,
  body.kls-rtl .notification-panel::before,
  #app.kls-rtl .notification-panel::before{
    display:none!important;
    content:none!important;
  }
  html[dir="rtl"] .notification-panel-list,
  body.kls-rtl .notification-panel-list,
  #app.kls-rtl .notification-panel-list{
    max-height:calc(100svh - 250px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
}
@media (max-width:520px){
  html[dir="rtl"] .notification-panel,
  body.kls-rtl .notification-panel,
  #app.kls-rtl .notification-panel{
    top:calc(108px + env(safe-area-inset-top,0px))!important;
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
  }
}


/* V3.0.49 — Security RTL checkbox alignment fix ONLY
   Scope: Security page check-card checkbox indicators in Kurdish/Arabic RTL.
   English/LTR stays unchanged. */
html[dir="rtl"] body #view-security .security-check-card::after,
body.kls-rtl #view-security .security-check-card::after,
#view-security[dir="rtl"] .security-check-card::after{
  left:10px!important;
  right:auto!important;
}
html[dir="rtl"] body #view-security .security-check-card:has(input:checked)::before,
body.kls-rtl #view-security .security-check-card:has(input:checked)::before,
#view-security[dir="rtl"] .security-check-card:has(input:checked)::before{
  left:14px!important;
  right:auto!important;
}
html[dir="rtl"] body #view-security .security-check-card .security-check-content,
body.kls-rtl #view-security .security-check-card .security-check-content,
#view-security[dir="rtl"] .security-check-card .security-check-content{
  padding:10px 10px 10px 38px!important;
  direction:rtl!important;
  text-align:right!important;
}
@media (max-width:760px){
  html[dir="rtl"] body #view-security .security-check-card::after,
  body.kls-rtl #view-security .security-check-card::after,
  #view-security[dir="rtl"] .security-check-card::after{
    left:10px!important;
    right:auto!important;
  }
  html[dir="rtl"] body #view-security .security-check-card:has(input:checked)::before,
  body.kls-rtl #view-security .security-check-card:has(input:checked)::before,
  #view-security[dir="rtl"] .security-check-card:has(input:checked)::before{
    left:14px!important;
    right:auto!important;
  }
  html[dir="rtl"] body #view-security .security-check-card .security-check-content,
  body.kls-rtl #view-security .security-check-card .security-check-content,
  #view-security[dir="rtl"] .security-check-card .security-check-content{
    padding:10px 10px 10px 38px!important;
  }
}


/* V3.0.50 — Dashboard chart cards fit fix
   Scope only: Dashboard > Template Usage + Labels Printed This Week.
   Purpose: keep donut legend percentages and weekly bar labels inside cards when sidebar is expanded/collapsed, EN/KU/AR. */
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"],
#view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"]{
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-card-content,
#view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-card-content{
  min-width:0!important;
  max-width:100%!important;
  width:100%!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
}

/* Template Usage donut + legend: compact grid that never pushes values outside the card */
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap{
  display:grid!important;
  grid-template-columns:minmax(104px,128px) minmax(0,1fr)!important;
  align-items:center!important;
  justify-content:center!important;
  justify-items:center!important;
  gap:10px!important;
  min-width:0!important;
  max-width:100%!important;
  width:100%!important;
  min-height:190px!important;
  padding:0!important;
  margin:0!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut{
  width:128px!important;
  height:128px!important;
  min-width:128px!important;
  max-width:128px!important;
  flex:0 0 128px!important;
  margin:0!important;
  box-sizing:border-box!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut:after{
  width:74px!important;
  height:74px!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut span{
  font-size:11.5px!important;
  line-height:1.05!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut b{
  font-size:22px!important;
  line-height:1!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut small{
  font-size:10.5px!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  gap:8px!important;
  font-size:12.5px!important;
  line-height:1.25!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend div{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:8px!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend span{
  min-width:0!important;
  max-width:100%!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  white-space:normal!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend i{
  width:10px!important;
  height:10px!important;
  min-width:10px!important;
  margin:0!important;
  flex:0 0 10px!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend b{
  min-width:34px!important;
  text-align:end!important;
  white-space:nowrap!important;
  font-size:12.5px!important;
  color:#071827!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap{
  direction:rtl!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut{
  direction:ltr!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend{
  direction:rtl!important;
  text-align:right!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend div,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend div,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend div{
  grid-template-columns:auto minmax(0,1fr)!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend b,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend b,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend b{
  grid-column:1!important;
  grid-row:1!important;
  text-align:left!important;
  direction:ltr!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend span,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend span,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend span{
  grid-column:2!important;
  grid-row:1!important;
  justify-content:flex-start!important;
  text-align:right!important;
  flex-direction:row-reverse!important;
}

/* Labels Printed This Week: compact but readable bars and axis labels */
#view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-chart{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:185px!important;
  min-height:185px!important;
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:clamp(4px,1vw,9px)!important;
  padding:12px 8px 7px!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-item{
  flex:1 1 0!important;
  min-width:0!important;
  max-width:100%!important;
  gap:6px!important;
  overflow:visible!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar{
  width:clamp(14px,2.2vw,22px)!important;
  max-width:22px!important;
  min-width:10px!important;
  border-radius:8px 8px 3px 3px!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-value{
  font-size:11.5px!important;
  line-height:1!important;
  white-space:nowrap!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-label{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  text-align:center!important;
  font-size:11px!important;
  line-height:1.1!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  overflow:visible!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-chart,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-chart,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-chart{
  direction:rtl!important;
  text-align:center!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-item,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-item,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-item{
  direction:rtl!important;
}

@media (max-width:1400px){
  #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap{
    grid-template-columns:minmax(100px,122px) minmax(0,1fr)!important;
    gap:9px!important;
  }
  #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut{
    width:122px!important;
    height:122px!important;
    min-width:122px!important;
    max-width:122px!important;
    flex-basis:122px!important;
  }
  #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut:after{width:70px!important;height:70px!important;}
  #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend{font-size:12px!important;}
}
@media (max-width:1100px){
  #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap{
    grid-template-columns:1fr!important;
    justify-items:center!important;
    gap:12px!important;
    min-height:auto!important;
  }
  #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend{
    width:min(100%,240px)!important;
  }
}
@media (max-width:900px){
  #view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-chart{
    height:180px!important;
    min-height:180px!important;
    gap:5px!important;
    padding-inline:6px!important;
  }
  #view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar{
    width:18px!important;
  }
  #view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-label{
    font-size:10.5px!important;
  }
}
@media (max-width:480px){
  #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut{width:116px!important;height:116px!important;min-width:116px!important;max-width:116px!important;}
  #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut:after{width:66px!important;height:66px!important;}
  #view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-chart{gap:3px!important;padding-inline:4px!important;}
  #view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar{width:14px!important;}
  #view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-label{font-size:9.8px!important;}
}

/* V3.0.51 — Dashboard expanded-sidebar chart spacing polish
   Scope only: Dashboard grid/chart cards. Keeps card content readable with sidebar expanded/collapsed in EN/KU/AR. */
#view-dashboard.dashboard-pro-view .dashboard-mid-grid,
#view-dashboard.dashboard-pro-view .dashboard-bottom-grid{
  width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}

/* Let the dashboard cards reflow instead of squeezing when the full sidebar is expanded. */
body:not(.sidebar-collapsed) #view-dashboard.dashboard-pro-view .dashboard-mid-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr))!important;
  gap:14px!important;
}
body.sidebar-collapsed #view-dashboard.dashboard-pro-view .dashboard-mid-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))!important;
  gap:14px!important;
}
body:not(.sidebar-collapsed) #view-dashboard.dashboard-pro-view .dashboard-bottom-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr))!important;
}
body.sidebar-collapsed #view-dashboard.dashboard-pro-view .dashboard-bottom-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr))!important;
}
#view-dashboard.dashboard-pro-view .dashboard-mid-grid > .dash-section:not(.is-collapsed){
  min-width:0!important;
  min-height:292px!important;
  overflow:hidden!important;
}

/* Chart card headers: keep titles neat and prevent narrow-card pushing. */
#view-dashboard.dashboard-pro-view .dashboard-mid-grid .dash-card-head{
  min-width:0!important;
}
#view-dashboard.dashboard-pro-view .dashboard-mid-grid .dash-card-head h3{
  min-width:0!important;
  max-width:calc(100% - 48px)!important;
  line-height:1.2!important;
  overflow-wrap:anywhere!important;
}

/* Labels Printed This Week: never split short day names letter-by-letter. */
#view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-card-content{
  overflow:visible!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-chart{
  height:205px!important;
  min-height:205px!important;
  padding:14px 10px 10px!important;
  gap:clamp(5px,.8vw,12px)!important;
  overflow:hidden!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-item{
  min-width:0!important;
  overflow:visible!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-label{
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:normal!important;
  word-break:keep-all!important;
  font-size:clamp(10px,.72vw,11.5px)!important;
  line-height:1.15!important;
  letter-spacing:-.01em!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar{
  width:clamp(16px,1.75vw,24px)!important;
  max-width:24px!important;
}

/* Activity Trend: compact legend without cramped spacing. */
#view-dashboard.dashboard-pro-view [data-dashboard-card="activity-trend"] .dash-card-content{
  min-width:0!important;
  overflow:hidden!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="activity-trend"] .dash-chart-legend{
  flex-wrap:wrap!important;
  gap:10px 14px!important;
  line-height:1.2!important;
  margin-bottom:8px!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="activity-trend"] .dash-chart-legend span{
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  min-width:0!important;
  white-space:normal!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="activity-trend"] .dash-line-chart{
  min-height:204px!important;
}

/* Template Usage: balanced donut + legend, no big blank spaces, no percentage overflow. */
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap{
  grid-template-columns:minmax(124px,150px) minmax(126px,1fr)!important;
  gap:14px!important;
  min-height:205px!important;
  justify-content:center!important;
  align-items:center!important;
  overflow:hidden!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut{
  width:clamp(124px,36%,150px)!important;
  height:clamp(124px,36%,150px)!important;
  min-width:124px!important;
  max-width:150px!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut:after{
  width:clamp(70px,20%,86px)!important;
  height:clamp(70px,20%,86px)!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend{
  min-width:0!important;
  max-width:100%!important;
  font-size:12.5px!important;
  gap:9px!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend div{
  min-width:0!important;
  max-width:100%!important;
  gap:8px!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend span{
  min-width:0!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  line-height:1.25!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend b{
  flex:0 0 auto!important;
  min-width:34px!important;
  white-space:nowrap!important;
}

html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-label,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-label,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="labels-week"] .dash-bar-label{
  white-space:nowrap!important;
  word-break:keep-all!important;
  font-size:clamp(9.6px,.7vw,11px)!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="activity-trend"] .dash-chart-legend,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="activity-trend"] .dash-chart-legend,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="activity-trend"] .dash-chart-legend{
  direction:rtl!important;
  justify-content:flex-start!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap{
  grid-template-columns:minmax(126px,1fr) minmax(124px,150px)!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut{
  grid-column:2!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend{
  grid-column:1!important;
}

@media (max-width:1100px){
  #view-dashboard.dashboard-pro-view .dashboard-mid-grid,
  #view-dashboard.dashboard-pro-view .dashboard-bottom-grid{
    grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))!important;
  }
}
@media (max-width:760px){
  #view-dashboard.dashboard-pro-view .dashboard-mid-grid,
  #view-dashboard.dashboard-pro-view .dashboard-bottom-grid{
    grid-template-columns:1fr!important;
  }
  #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap,
  html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap,
  body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap,
  #app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap{
    grid-template-columns:minmax(0,1fr)!important;
    justify-items:center!important;
    gap:12px!important;
  }
  #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut,
  #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend{
    grid-column:auto!important;
  }
}


/* V3.0.52 — Dashboard Template Usage collapse/expand hard fix
   Scope ONLY: Dashboard > Template Usage card. Keeps chart layout unchanged when expanded. */
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"].is-collapsed .dash-card-content,
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"].is-collapsed .dash-donut-wrap,
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"].is-collapsed #dashboardDonut,
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"].is-collapsed #dashboardDonutLegend,
#app #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"].is-collapsed .dash-card-content,
#app #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"].is-collapsed .dash-donut-wrap,
#app #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"].is-collapsed #dashboardDonut,
#app #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"].is-collapsed #dashboardDonutLegend{
  display:none!important;
  visibility:hidden!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  width:0!important;
  min-width:0!important;
  max-width:0!important;
  margin:0!important;
  padding:0!important;
  gap:0!important;
  overflow:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"].is-collapsed,
#app #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"].is-collapsed{
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  padding:14px 16px!important;
  align-self:start!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"].is-collapsed .dash-card-head,
#app #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"].is-collapsed .dash-card-head{
  margin-bottom:0!important;
}
#view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"]:not(.is-collapsed) .dash-card-content.dash-donut-wrap,
#app #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"]:not(.is-collapsed) .dash-card-content.dash-donut-wrap{
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
}


/* V3.0.54 — Collapsed sidebar bottom ghost/scrollbar hard hide
   Scope only: collapsed sidebar. Removes the gray Install App ghost / scrollbar thumb at the bottom. */
html body.sidebar-collapsed #app.app-shell #appSidebar .sidebar-controls,
html body.sidebar-collapsed #app.app-shell #appSidebar .sidebar-controls *,
html body.sidebar-collapsed #app.app-shell #appSidebar .sidebar-controls-minimal,
html body.sidebar-collapsed #app.app-shell #appSidebar .sidebar-controls-minimal *,
html body.sidebar-collapsed #app.app-shell #appSidebar #installBtn{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  width:0!important;
  min-width:0!important;
  max-width:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
  pointer-events:none!important;
  position:absolute!important;
  left:-99999px!important;
  right:auto!important;
  bottom:auto!important;
}
html body.sidebar-collapsed #app.app-shell #appSidebar,
html body.sidebar-collapsed #app.app-shell #appSidebar .nav-grid{
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
}
html body.sidebar-collapsed #app.app-shell #appSidebar::-webkit-scrollbar,
html body.sidebar-collapsed #app.app-shell #appSidebar .nav-grid::-webkit-scrollbar{
  width:0!important;
  height:0!important;
  display:none!important;
  background:transparent!important;
}
html body.sidebar-collapsed #app.app-shell #appSidebar::-webkit-scrollbar-thumb,
html body.sidebar-collapsed #app.app-shell #appSidebar .nav-grid::-webkit-scrollbar-thumb,
html body.sidebar-collapsed #app.app-shell #appSidebar::-webkit-scrollbar-track,
html body.sidebar-collapsed #app.app-shell #appSidebar .nav-grid::-webkit-scrollbar-track{
  display:none!important;
  width:0!important;
  height:0!important;
  background:transparent!important;
  border:0!important;
}


/* V3.0.61 — Dashboard Template Usage RTL legend hard polish
   Scope: Dashboard Template Usage card only, Kurdish/Arabic RTL only.
   Purpose: prevent legend labels from becoming vertical and keep donut + values inside card. */
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap{
  display:grid!important;
  grid-template-columns:minmax(150px,1fr) 126px!important;
  grid-template-areas:"legend donut"!important;
  align-items:center!important;
  justify-content:center!important;
  justify-items:stretch!important;
  gap:10px!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  padding:0 2px!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut{
  grid-area:donut!important;
  width:126px!important;
  height:126px!important;
  min-width:126px!important;
  max-width:126px!important;
  margin:0 auto!important;
  direction:ltr!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend{
  grid-area:legend!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:stretch!important;
  gap:8px!important;
  width:100%!important;
  min-width:150px!important;
  max-width:100%!important;
  overflow:hidden!important;
  direction:rtl!important;
  text-align:right!important;
  font-size:12px!important;
  line-height:1.25!important;
  box-sizing:border-box!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend div,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend div,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend div{
  display:grid!important;
  grid-template-columns:10px minmax(82px,1fr) 34px!important;
  align-items:center!important;
  column-gap:6px!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  direction:rtl!important;
  box-sizing:border-box!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend i,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend i,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend i{
  grid-column:1!important;
  width:10px!important;
  height:10px!important;
  min-width:10px!important;
  max-width:10px!important;
  margin:0!important;
  display:block!important;
  flex:none!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend span,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend span,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend span{
  grid-column:1 / 3!important;
  display:grid!important;
  grid-template-columns:10px minmax(0,1fr)!important;
  align-items:center!important;
  column-gap:6px!important;
  min-width:0!important;
  max-width:100%!important;
  width:100%!important;
  white-space:normal!important;
  word-break:normal!important;
  overflow-wrap:break-word!important;
  text-align:right!important;
  direction:rtl!important;
  line-height:1.25!important;
  box-sizing:border-box!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend span i,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend span i,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend span i{
  grid-column:1!important;
  grid-row:1!important;
}
html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend b,
body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend b,
#app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend b{
  grid-column:3!important;
  min-width:34px!important;
  max-width:34px!important;
  width:34px!important;
  text-align:left!important;
  direction:ltr!important;
  white-space:nowrap!important;
  font-size:12px!important;
  line-height:1.1!important;
  overflow:visible!important;
}
@media (max-width:520px){
  html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap,
  body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap,
  #app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap{
    grid-template-columns:1fr!important;
    grid-template-areas:"donut" "legend"!important;
    gap:10px!important;
    justify-items:center!important;
  }
  html[dir="rtl"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend,
  body.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend,
  #app.kls-rtl #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend{
    min-width:0!important;
    width:min(100%, 220px)!important;
  }
}

/* V3.0.61 — Dashboard Template Usage English mobile legend polish
   Scope: Dashboard Template Usage card only, English/LTR mobile only.
   Purpose: keep the donut and legend separated on mobile so English labels do not overlap the chart. */
@media (max-width: 560px){
  html[dir="ltr"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-card-content.dash-donut-wrap,
  html[dir="ltr"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap,
  body:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-card-content.dash-donut-wrap,
  body:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap,
  #app:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-card-content.dash-donut-wrap,
  #app:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-wrap{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-areas:"donut" "legend"!important;
    justify-items:center!important;
    align-items:center!important;
    gap:12px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-height:0!important;
    padding:6px 8px 8px!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    direction:ltr!important;
  }
  html[dir="ltr"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut,
  body:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut,
  #app:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut{
    grid-area:donut!important;
    width:118px!important;
    height:118px!important;
    min-width:118px!important;
    max-width:118px!important;
    margin:0 auto!important;
    flex:none!important;
    position:relative!important;
    z-index:1!important;
  }
  html[dir="ltr"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut:after,
  body:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut:after,
  #app:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut:after{
    width:66px!important;
    height:66px!important;
  }
  html[dir="ltr"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend,
  body:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend,
  #app:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend{
    grid-area:legend!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:stretch!important;
    gap:7px!important;
    width:min(100%, 245px)!important;
    min-width:0!important;
    max-width:245px!important;
    margin:0 auto!important;
    padding:0!important;
    overflow:hidden!important;
    direction:ltr!important;
    text-align:left!important;
    font-size:11.5px!important;
    line-height:1.2!important;
    box-sizing:border-box!important;
  }
  html[dir="ltr"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend div,
  body:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend div,
  #app:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend div{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 34px!important;
    align-items:center!important;
    gap:7px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  html[dir="ltr"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend span,
  body:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend span,
  #app:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend span{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:7px!important;
    min-width:0!important;
    max-width:100%!important;
    width:100%!important;
    white-space:normal!important;
    overflow-wrap:break-word!important;
    word-break:normal!important;
    text-align:left!important;
    line-height:1.2!important;
    direction:ltr!important;
    box-sizing:border-box!important;
  }
  html[dir="ltr"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend i,
  body:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend i,
  #app:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend i{
    width:9px!important;
    height:9px!important;
    min-width:9px!important;
    max-width:9px!important;
    flex:0 0 9px!important;
    margin:0!important;
  }
  html[dir="ltr"] #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend b,
  body:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend b,
  #app:not(.kls-rtl) #view-dashboard.dashboard-pro-view [data-dashboard-card="template-usage"] .dash-donut-legend b{
    min-width:34px!important;
    width:34px!important;
    text-align:right!important;
    direction:ltr!important;
    white-space:nowrap!important;
    font-size:11.5px!important;
    line-height:1.1!important;
    color:#071827!important;
  }
}

/* V3.0.61 — Global modal background scroll lock polish */
html.kls-modal-open,
body.kls-modal-open{
  overflow:hidden!important;
  overscroll-behavior:none!important;
  touch-action:none!important;
}
body.kls-modal-open .modal:not(.hidden),
body.kls-modal-open .activity-details-modal:not(.hidden),
body.kls-modal-open .kls-confirm.show{
  overscroll-behavior:contain!important;
  touch-action:auto!important;
}
body.kls-modal-open .modal:not(.hidden){overflow-y:auto!important;overflow-x:hidden!important;}
body.kls-modal-open .modal:not(.hidden) .modal-card{
  max-height:calc(100vh - 40px)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
}
@media (max-width:720px){
  body.kls-modal-open .modal:not(.hidden){padding:14px!important;align-items:flex-start!important;}
  body.kls-modal-open .modal:not(.hidden) .modal-card{max-height:calc(100vh - 28px)!important;}
}

/* V3.0.61 — Modal must stay above fixed/mobile headers on every page */
html.kls-modal-open,
body.kls-modal-open{
  overflow:hidden!important;
  overscroll-behavior:none!important;
}
body.kls-modal-open .modal:not(.hidden),
body.kls-modal-open .profile-modal:not(.hidden),
body.kls-modal-open .scanner-modal:not(.hidden),
body.kls-modal-open .activity-details-modal:not(.hidden),
body.kls-modal-open .kls-confirm.show{
  position:fixed!important;
  inset:0!important;
  z-index:2147483000!important;
  isolation:isolate!important;
}
body.kls-modal-open .modal:not(.hidden),
body.kls-modal-open .profile-modal:not(.hidden),
body.kls-modal-open .scanner-modal:not(.hidden){
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:clamp(12px,3.5vh,24px)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  touch-action:auto!important;
}
body.kls-modal-open .modal:not(.hidden) .modal-card,
body.kls-modal-open .profile-modal:not(.hidden) .modal-card,
body.kls-modal-open .scanner-modal:not(.hidden) .modal-card{
  position:relative!important;
  z-index:2147483001!important;
  max-height:calc(100dvh - 32px)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
}
@media (max-width:720px){
  body.kls-modal-open .modal:not(.hidden),
  body.kls-modal-open .profile-modal:not(.hidden),
  body.kls-modal-open .scanner-modal:not(.hidden){
    align-items:center!important;
    justify-content:center!important;
    padding:16px!important;
  }
  body.kls-modal-open .modal:not(.hidden) .modal-card,
  body.kls-modal-open .profile-modal:not(.hidden) .modal-card,
  body.kls-modal-open .scanner-modal:not(.hidden) .modal-card{
    width:min(100%,420px)!important;
    max-height:calc(100dvh - 32px)!important;
    margin:auto!important;
  }
  body.kls-modal-open .profile-modal:not(.hidden) .pro-profile-card{
    border-radius:24px!important;
  }
}


/* V3.0.61 — Template Designer Layer Actions font-size polish only
   Scope: Template page > Layer Actions buttons. No layout/logic changes. */
#view-templates .phase6-actions-menu .phase6-layer-actions button,
#view-templates #p6LayerActionsMenu button{
  font-size:10px!important;
  line-height:1.08!important;
  letter-spacing:-0.12px!important;
}
#view-templates .phase6-actions-toggle,
#view-templates #p6LayerActionsToggle{
  font-size:11px!important;
  line-height:1.1!important;
}
html[dir="rtl"] #view-templates .phase6-actions-menu .phase6-layer-actions button,
body.kls-rtl #view-templates .phase6-actions-menu .phase6-layer-actions button,
#view-templates[dir="rtl"] .phase6-actions-menu .phase6-layer-actions button{
  font-size:9.6px!important;
  line-height:1.12!important;
  letter-spacing:-0.18px!important;
}
html[dir="rtl"] #view-templates .phase6-actions-toggle,
body.kls-rtl #view-templates .phase6-actions-toggle,
#view-templates[dir="rtl"] .phase6-actions-toggle{
  font-size:10.5px!important;
  line-height:1.12!important;
}
@media (max-width: 760px){
  #view-templates .phase6-actions-menu .phase6-layer-actions button,
  #view-templates #p6LayerActionsMenu button{
    font-size:9.4px!important;
    line-height:1.12!important;
    letter-spacing:-0.18px!important;
  }
  #view-templates .phase6-actions-toggle,
  #view-templates #p6LayerActionsToggle{
    font-size:10px!important;
    line-height:1.12!important;
  }
}


/* V3.0.62 — Template Designer Layer Actions PRO fit polish
   Scope only: Templates page > Layer Actions buttons. */
#view-templates .phase6-actions-menu .phase6-layer-actions,
#view-templates #p6LayerActionsMenu{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:7px!important;
  padding:9px!important;
  overflow:visible!important;
  align-items:stretch!important;
}
#view-templates .phase6-actions-menu .phase6-layer-actions button,
#view-templates #p6LayerActionsMenu button{
  width:100%!important;
  min-width:0!important;
  min-height:42px!important;
  height:auto!important;
  padding:6px 5px!important;
  border-radius:12px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:4px!important;
  overflow:visible!important;
  white-space:normal!important;
  text-overflow:clip!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
  text-align:center!important;
  font-size:9.2px!important;
  line-height:1.16!important;
  letter-spacing:-0.25px!important;
}
#view-templates .phase6-actions-menu .phase6-layer-actions button .phase6-svg-icon,
#view-templates #p6LayerActionsMenu button .phase6-svg-icon{
  width:12px!important;
  height:12px!important;
  flex:0 0 12px!important;
  margin:0!important;
}
#view-templates .phase6-actions-menu .phase6-layer-actions button .p6-action-label,
#view-templates #p6LayerActionsMenu button .p6-action-label{
  display:block!important;
  min-width:0!important;
  max-width:100%!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  line-height:1.16!important;
  text-align:center!important;
}
#view-templates #p6DeleteSelected{
  grid-column:1/-1!important;
  min-height:38px!important;
  font-size:9.8px!important;
}
html[dir="rtl"] #view-templates .phase6-actions-menu .phase6-layer-actions button,
body.kls-rtl #view-templates .phase6-actions-menu .phase6-layer-actions button,
#view-templates[dir="rtl"] .phase6-actions-menu .phase6-layer-actions button{
  direction:rtl!important;
  font-size:9px!important;
  line-height:1.18!important;
  letter-spacing:-0.2px!important;
}
@media (max-width:1180px){
  #view-templates .phase6-actions-menu .phase6-layer-actions,
  #view-templates #p6LayerActionsMenu{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media (max-width:760px){
  #view-templates .phase6-actions-menu .phase6-layer-actions,
  #view-templates #p6LayerActionsMenu{
    gap:6px!important;
    padding:8px!important;
  }
  #view-templates .phase6-actions-menu .phase6-layer-actions button,
  #view-templates #p6LayerActionsMenu button{
    min-height:40px!important;
    padding:6px 4px!important;
    font-size:8.9px!important;
    line-height:1.16!important;
    letter-spacing:-0.28px!important;
  }
  html[dir="rtl"] #view-templates .phase6-actions-menu .phase6-layer-actions button,
  body.kls-rtl #view-templates .phase6-actions-menu .phase6-layer-actions button,
  #view-templates[dir="rtl"] .phase6-actions-menu .phase6-layer-actions button{
    font-size:8.8px!important;
    line-height:1.18!important;
  }
}

/* V3.0.64 — Template Designer Layer Actions collapse body fix
   Scope only: Templates page > Layer Actions collapsed content container.
   Keeps V3.0.62 button styling unchanged when expanded. */
#view-templates .phase6-actions-menu .phase6-layer-actions.is-hidden,
#view-templates #p6LayerActionsMenu.is-hidden,
#view-templates .phase6-actions-menu .phase6-layer-actions[hidden],
#view-templates #p6LayerActionsMenu[hidden]{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  pointer-events:none!important;
}
#view-templates .phase6-actions-menu:has(.phase6-layer-actions.is-hidden),
#view-templates .phase6-actions-menu:has(#p6LayerActionsMenu.is-hidden){
  gap:0!important;
}

/* V3.0.64 — Activity Log RTL Pagination Arrow Flip Only
   Scope: Activity page pagination next/back icons only.
   English/LTR remains unchanged. Kurdish/Arabic RTL flips icon direction only. */
html[dir="rtl"] body #view-activity .activity-page-mini[data-page-nav] .kls-ui-icon,
body.kls-rtl #view-activity .activity-page-mini[data-page-nav] .kls-ui-icon,
#view-activity[dir="rtl"] .activity-page-mini[data-page-nav] .kls-ui-icon{
  transform: scaleX(-1) !important;
  transform-origin: center center !important;
}

/* V3.0.66 — External Sync mobile Add Source Tables dropdown polish only
   Scope: External Sync > Sync Overview source table picker on mobile. */
@media (max-width:640px){
  #view-sync .sync-overview-card,
  #view-sync .sync-overview-card .sync-card-body,
  #view-sync .sync-status-wrap,
  #view-sync .sync-overview-main,
  #view-sync .sync-overview-block.source-block,
  #view-sync #syncTablePicker,
  #view-sync .sync-multi-select{overflow:visible!important;}
  #view-sync #syncTablePicker{position:relative!important;z-index:9990!important;}
  #view-sync #syncTablePicker.open{z-index:9998!important;}
  #view-sync #syncTablePickerMenu.sync-multi-menu{
    position:absolute!important;top:calc(100% + 10px)!important;bottom:auto!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;
    width:min(306px, calc(100vw - 44px))!important;min-width:min(286px, calc(100vw - 44px))!important;max-width:min(306px, calc(100vw - 44px))!important;
    max-height:min(330px, 54vh)!important;padding:10px!important;border-radius:20px!important;background:#fff!important;border:1px solid #cfe4f2!important;
    box-shadow:0 24px 54px rgba(10,33,56,.20)!important;z-index:9999!important;overflow:hidden!important;
  }
  html[dir="rtl"] #view-sync #syncTablePickerMenu.sync-multi-menu,#view-sync[dir="rtl"] #syncTablePickerMenu.sync-multi-menu{left:50%!important;right:auto!important;transform:translateX(-50%)!important;direction:rtl!important;text-align:right!important;}
  html[dir="ltr"] #view-sync #syncTablePickerMenu.sync-multi-menu,#view-sync[dir="ltr"] #syncTablePickerMenu.sync-multi-menu{left:50%!important;right:auto!important;transform:translateX(-50%)!important;direction:ltr!important;text-align:left!important;}
  #view-sync #syncTablePickerMenu.sync-multi-menu::before{display:none!important;}
  #view-sync #syncTablePickerMenu .sync-multi-search-wrap{margin-bottom:8px!important;}
  #view-sync #syncTableSearch{width:100%!important;height:42px!important;min-height:42px!important;font-size:12.5px!important;border-radius:14px!important;}
  #view-sync #syncTablePickerMenu .sync-multi-selectall{display:flex!important;align-items:center!important;justify-content:flex-start!important;width:100%!important;min-height:40px!important;margin-bottom:8px!important;font-size:12px!important;line-height:1.25!important;}
  html[dir="rtl"] #view-sync #syncTablePickerMenu .sync-multi-selectall,#view-sync[dir="rtl"] #syncTablePickerMenu .sync-multi-selectall{flex-direction:row-reverse!important;text-align:right!important;}
  #view-sync #syncTableOptions.sync-multi-options{max-height:min(190px, 36vh)!important;min-height:74px!important;display:grid!important;gap:7px!important;overflow-y:auto!important;overflow-x:hidden!important;padding:2px!important;}
  #view-sync #syncTablePickerMenu .muted{display:block!important;text-align:center!important;padding:14px 8px!important;font-size:12.5px!important;line-height:1.35!important;}
  #view-sync #syncTableOptions .sync-multi-option{min-height:42px!important;padding:8px 10px!important;font-size:12.5px!important;line-height:1.25!important;grid-template-columns:minmax(0,1fr) auto!important;}
  html[dir="rtl"] #view-sync #syncTableOptions .sync-multi-option,#view-sync[dir="rtl"] #syncTableOptions .sync-multi-option{grid-template-columns:auto minmax(0,1fr)!important;direction:rtl!important;}
  html[dir="rtl"] #view-sync #syncTableOptions .sync-multi-option input,#view-sync[dir="rtl"] #syncTableOptions .sync-multi-option input{order:1!important;}
  html[dir="rtl"] #view-sync #syncTableOptions .sync-multi-option span,#view-sync[dir="rtl"] #syncTableOptions .sync-multi-option span{order:2!important;text-align:right!important;}
  body.theme-dark #view-sync #syncTablePickerMenu.sync-multi-menu,#app.app-shell.dark #view-sync #syncTablePickerMenu.sync-multi-menu{background:linear-gradient(180deg,rgba(7,18,29,.99),rgba(6,16,26,.99))!important;border-color:#2d536d!important;box-shadow:0 24px 54px rgba(0,0,0,.52)!important;}
}

/* V3.0.66 — Security mobile action button alignment + Blocked/Whitelisted detail cards
   Scope: Security page only. Keeps desktop unchanged. */
@media (max-width:760px){
  html body #app.app-shell #view-security [data-security-section="settings"] .security-form-actions.full,
  html body #app.app-shell #view-security [data-security-section="manual"] .security-form-actions.full{display:flex!important;width:100%!important;justify-content:flex-end!important;align-items:center!important;text-align:right!important;padding-top:10px!important;}
  html body #app.app-shell #view-security [data-security-section="settings"] .security-form-actions.full .security-submit-btn,
  html body #app.app-shell #view-security [data-security-section="manual"] .security-form-actions.full .security-submit-btn,
  html body #app.app-shell #view-security #securityManualSubmitBtn{margin-left:auto!important;margin-right:0!important;align-self:flex-end!important;justify-self:end!important;width:auto!important;min-width:128px!important;max-width:100%!important;}
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap{display:block!important;width:100%!important;overflow:visible!important;}
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap table,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap table,
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody{display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;border-spacing:0!important;}
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap thead,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap thead{display:none!important;}
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody tr,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody tr,
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody tr:nth-child(n),
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody tr:nth-child(n){display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;margin:0 0 10px!important;padding:12px!important;border:1px solid #dde8f3!important;border-radius:16px!important;background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%)!important;box-shadow:0 8px 18px rgba(15,23,42,.035)!important;overflow:visible!important;}
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td{display:grid!important;grid-template-columns:96px minmax(0,1fr)!important;align-items:start!important;gap:10px!important;width:100%!important;min-width:0!important;max-width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;padding:7px 0!important;border:0!important;border-bottom:1px solid rgba(226,237,247,.84)!important;background:transparent!important;color:#10233a!important;-webkit-text-fill-color:#10233a!important;font-size:12px!important;line-height:1.35!important;font-weight:750!important;text-align:left!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;word-break:break-word!important;}
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td:last-child,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td:last-child{border-bottom:0!important;padding-bottom:0!important;}
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td::before,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td::before{content:attr(data-label)!important;display:block!important;min-width:0!important;margin:1px 0 0!important;color:#6b829a!important;-webkit-text-fill-color:#6b829a!important;font-size:9.5px!important;line-height:1.2!important;font-weight:900!important;letter-spacing:.045em!important;text-transform:uppercase!important;text-align:left!important;white-space:normal!important;}
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td strong,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td strong,
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td span,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td span,
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td div,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td div{min-width:0!important;max-width:100%!important;color:#071b2f!important;-webkit-text-fill-color:#071b2f!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;word-break:break-word!important;}
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-action-row,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-action-row{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:8px!important;flex-wrap:wrap!important;}
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-more,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-more{display:flex!important;justify-content:center!important;align-items:center!important;height:auto!important;min-height:0!important;padding:8px 0 0!important;}
  html[dir="rtl"] body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td,
  html[dir="rtl"] body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td,
  body.kls-rtl #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td,
  body.kls-rtl #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td{grid-template-columns:96px minmax(0,1fr)!important;text-align:right!important;}
  html[dir="rtl"] body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td::before,
  html[dir="rtl"] body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td::before,
  body.kls-rtl #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td::before,
  body.kls-rtl #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td::before{text-align:right!important;}
  html body #app.app-shell.dark #view-security [data-security-section="blocks"] .security-table-wrap tbody tr,
  html body #app.app-shell.dark #view-security [data-security-section="whitelist"] .security-table-wrap tbody tr,
  html body.theme-dark #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody tr,
  html body.theme-dark #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody tr{background:linear-gradient(180deg,#07131f 0%,#091827 100%)!important;border-color:#244057!important;box-shadow:none!important;}
  html body #app.app-shell.dark #view-security [data-security-section="blocks"] .security-table-wrap tbody td,
  html body #app.app-shell.dark #view-security [data-security-section="whitelist"] .security-table-wrap tbody td,
  html body.theme-dark #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td,
  html body.theme-dark #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td{color:#d9e8f7!important;-webkit-text-fill-color:#d9e8f7!important;border-color:#20364f!important;}
  html body #app.app-shell.dark #view-security [data-security-section="blocks"] .security-table-wrap tbody td strong,
  html body #app.app-shell.dark #view-security [data-security-section="whitelist"] .security-table-wrap tbody td strong,
  html body.theme-dark #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td strong,
  html body.theme-dark #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td strong{color:#f8fbff!important;-webkit-text-fill-color:#f8fbff!important;}
}

/* V3.0.67 — Security mobile IP tables text readability fix only */
@media (max-width: 760px){
  #view-security .security-table-wrap{overflow:visible!important;}
  #view-security .security-table-wrap table,
  #view-security .security-table-wrap tbody,
  #view-security .security-table-wrap tr{width:100%!important;max-width:100%!important;}
  #view-security .security-table-wrap tr{display:block!important;padding:12px!important;border-radius:18px!important;box-sizing:border-box!important;}
  #view-security .security-table-wrap td{display:grid!important;grid-template-columns:minmax(92px,34%) minmax(0,1fr)!important;align-items:center!important;gap:8px!important;width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;padding:8px 0!important;border-bottom:1px solid rgba(148,163,184,.16)!important;text-align:start!important;white-space:normal!important;word-break:normal!important;overflow-wrap:anywhere!important;line-height:1.35!important;writing-mode:horizontal-tb!important;text-orientation:mixed!important;}
  #view-security .security-table-wrap td:last-child{border-bottom:0!important;}
  #view-security .security-table-wrap td::before{content:attr(data-label)!important;display:block!important;min-width:0!important;margin:0!important;color:var(--muted)!important;font-size:10px!important;font-weight:850!important;letter-spacing:.02em!important;text-transform:uppercase!important;white-space:normal!important;word-break:normal!important;overflow-wrap:anywhere!important;writing-mode:horizontal-tb!important;text-orientation:mixed!important;}
  #view-security .security-table-wrap td>*,#view-security .security-table-wrap td span,#view-security .security-table-wrap td small,#view-security .security-table-wrap td strong,#view-security .security-table-wrap td button,#view-security .security-table-wrap td .status-pill,#view-security .security-table-wrap td .risk-pill,#view-security .security-table-wrap td .attempt-badge{min-width:0!important;max-width:100%!important;white-space:normal!important;word-break:normal!important;overflow-wrap:anywhere!important;writing-mode:horizontal-tb!important;text-orientation:mixed!important;}
  #view-security .security-table-wrap .security-action-row{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;gap:8px!important;justify-content:flex-start!important;}
  html[dir="rtl"] #view-security .security-table-wrap .security-action-row,body.kls-rtl #view-security .security-table-wrap .security-action-row{justify-content:flex-end!important;}
}


/* V3.0.68 — Security mobile Blocked/Whitelisted IP cards PRO rebuild
   Scope: ONLY Security page mobile Blocked IP Addresses + Whitelisted IP Addresses.
   Purpose: replace the broken narrow table-cell mobile rendering with readable stacked cards.
   Desktop and Login Attempt Watchlist are intentionally unchanged. */
@media (max-width: 760px){
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    overflow:visible !important;
    padding:0 !important;
  }

  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap table,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap table,
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    table-layout:auto !important;
    border-collapse:separate !important;
    border-spacing:0 !important;
  }

  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap thead,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap thead{
    display:none !important;
  }

  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody tr,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody tr{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 0 12px !important;
    padding:12px 12px 10px !important;
    box-sizing:border-box !important;
    border:1px solid #dbe8f4 !important;
    border-radius:18px !important;
    background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%) !important;
    box-shadow:0 10px 22px rgba(15,23,42,.04) !important;
    overflow:visible !important;
  }

  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    padding:8px 0 !important;
    box-sizing:border-box !important;
    border:0 !important;
    border-bottom:1px solid rgba(217,232,246,.9) !important;
    background:transparent !important;
    color:#10233a !important;
    -webkit-text-fill-color:#10233a !important;
    font-size:12.25px !important;
    line-height:1.45 !important;
    font-weight:750 !important;
    letter-spacing:0 !important;
    text-align:left !important;
    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:break-word !important;
    word-wrap:break-word !important;
    writing-mode:horizontal-tb !important;
    text-orientation:mixed !important;
    overflow:visible !important;
    text-overflow:clip !important;
  }

  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td:last-child,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td:last-child{
    border-bottom:0 !important;
    padding-bottom:0 !important;
  }

  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td::before,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td::before{
    content:attr(data-label) !important;
    display:block !important;
    width:100% !important;
    margin:0 0 4px !important;
    color:#6f879f !important;
    -webkit-text-fill-color:#6f879f !important;
    font-size:9.5px !important;
    line-height:1.2 !important;
    font-weight:900 !important;
    letter-spacing:.04em !important;
    text-transform:uppercase !important;
    text-align:left !important;
    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:break-word !important;
    writing-mode:horizontal-tb !important;
    text-orientation:mixed !important;
  }

  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td *,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td *,
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td strong,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td strong,
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td span,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td span{
    display:inline-flex !important;
    max-width:100% !important;
    min-width:0 !important;
    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:break-word !important;
    writing-mode:horizontal-tb !important;
    text-orientation:mixed !important;
    color:inherit !important;
    -webkit-text-fill-color:inherit !important;
  }

  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap .security-action-row,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap .security-action-row{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;
    flex-wrap:wrap !important;
    width:100% !important;
  }

  html[dir="rtl"] body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td,
  html[dir="rtl"] body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td,
  body.kls-rtl #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td,
  body.kls-rtl #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td{
    direction:rtl !important;
    text-align:right !important;
  }

  html[dir="rtl"] body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td::before,
  html[dir="rtl"] body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td::before,
  body.kls-rtl #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td::before,
  body.kls-rtl #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td::before{
    text-align:right !important;
  }

  html[dir="rtl"] body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap .security-action-row,
  html[dir="rtl"] body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap .security-action-row,
  body.kls-rtl #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap .security-action-row,
  body.kls-rtl #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap .security-action-row{
    justify-content:flex-end !important;
  }

  html body #app.app-shell.dark #view-security [data-security-section="blocks"] .security-table-wrap tbody tr,
  html body #app.app-shell.dark #view-security [data-security-section="whitelist"] .security-table-wrap tbody tr,
  html body.theme-dark #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody tr,
  html body.theme-dark #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody tr{
    background:linear-gradient(180deg,#07131f 0%,#091827 100%) !important;
    border-color:#244057 !important;
    box-shadow:none !important;
  }

  html body #app.app-shell.dark #view-security [data-security-section="blocks"] .security-table-wrap tbody td,
  html body #app.app-shell.dark #view-security [data-security-section="whitelist"] .security-table-wrap tbody td,
  html body.theme-dark #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap tbody td,
  html body.theme-dark #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap tbody td{
    color:#d9e8f7 !important;
    -webkit-text-fill-color:#d9e8f7 !important;
    border-bottom-color:#20364f !important;
  }
}

/* V3.0.69 — Security mobile tables final PRO match */
@media (max-width: 760px){
  html body #app.app-shell #view-security .security-table-wrap{overflow:visible!important;width:100%!important;max-width:100%!important;}
  html body #app.app-shell #view-security .security-table-wrap table,
  html body #app.app-shell #view-security .security-table-wrap tbody{display:block!important;width:100%!important;max-width:100%!important;min-width:0!important;table-layout:auto!important;border-collapse:separate!important;}
  html body #app.app-shell #view-security .security-table-wrap thead{display:none!important;}
  html body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row){display:block!important;width:100%!important;max-width:100%!important;min-width:0!important;margin:0 0 10px!important;padding:12px 12px 10px!important;box-sizing:border-box!important;border:1px solid #dbe8f4!important;border-radius:16px!important;background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)!important;box-shadow:0 8px 18px rgba(15,23,42,.035)!important;overflow:hidden!important;}
  html body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td{display:grid!important;grid-template-columns:minmax(95px,36%) minmax(0,1fr)!important;align-items:center!important;gap:10px!important;width:100%!important;max-width:100%!important;min-width:0!important;height:auto!important;min-height:34px!important;padding:7px 0!important;margin:0!important;box-sizing:border-box!important;border:0!important;border-bottom:1px solid rgba(217,232,246,.92)!important;background:transparent!important;color:#10233a!important;-webkit-text-fill-color:#10233a!important;font-size:12px!important;line-height:1.35!important;font-weight:800!important;letter-spacing:0!important;text-align:start!important;white-space:normal!important;word-break:normal!important;overflow-wrap:anywhere!important;writing-mode:horizontal-tb!important;text-orientation:mixed!important;overflow:visible!important;}
  html body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td:last-child{border-bottom:0!important;padding-bottom:0!important;}
  html body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td::before{content:attr(data-label)!important;display:block!important;width:auto!important;min-width:0!important;margin:0!important;color:#6f879f!important;-webkit-text-fill-color:#6f879f!important;font-size:9px!important;line-height:1.15!important;font-weight:900!important;letter-spacing:.04em!important;text-transform:uppercase!important;text-align:start!important;white-space:normal!important;word-break:normal!important;overflow-wrap:anywhere!important;writing-mode:horizontal-tb!important;text-orientation:mixed!important;}
  html body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td > *,
  html body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td strong,
  html body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td span,
  html body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td div,
  html body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td button{max-width:100%!important;min-width:0!important;white-space:normal!important;word-break:normal!important;overflow-wrap:anywhere!important;writing-mode:horizontal-tb!important;text-orientation:mixed!important;text-align:inherit!important;}
  html body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td .security-table-pill,
  html body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td .security-table-risk{display:inline-flex!important;justify-self:start!important;align-self:center!important;width:auto!important;max-width:100%!important;white-space:nowrap!important;overflow-wrap:normal!important;}
  html body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td .security-action-row,
  html body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td .action-row{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;gap:8px!important;flex-wrap:wrap!important;width:auto!important;}
  html[dir="rtl"] body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td,
  body.kls-rtl #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td{direction:rtl!important;text-align:right!important;}
  html[dir="rtl"] body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td::before,
  body.kls-rtl #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td::before{text-align:right!important;}
  html[dir="rtl"] body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td .security-table-pill,
  html[dir="rtl"] body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td .security-table-risk,
  body.kls-rtl #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td .security-table-pill,
  body.kls-rtl #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td .security-table-risk{justify-self:end!important;}
  html[dir="rtl"] body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td .security-action-row,
  html[dir="rtl"] body #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td .action-row,
  body.kls-rtl #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td .security-action-row,
  body.kls-rtl #app.app-shell #view-security .security-table-wrap tbody tr:not(.security-empty-row) td .action-row{justify-content:flex-end!important;}
}


/* V3.0.71 — Security View More/View All links standardized in color, font size, and weight */
.security-ip-mobile-cards{display:none;}
@media (max-width:760px){
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-table-wrap,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-table-wrap{
    display:none!important;
  }
  html body #app.app-shell #view-security [data-security-section="blocks"] .security-ip-mobile-cards,
  html body #app.app-shell #view-security [data-security-section="whitelist"] .security-ip-mobile-cards{
    display:flex!important;
    flex-direction:column!important;
    gap:10px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:0!important;
    margin:0!important;
    box-sizing:border-box!important;
  }
  html body #app.app-shell #view-security .security-ip-mobile-card{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:12px 12px 10px!important;
    box-sizing:border-box!important;
    border:1px solid #dbe8f4!important;
    border-radius:16px!important;
    background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)!important;
    box-shadow:0 8px 18px rgba(15,23,42,.035)!important;
    overflow:hidden!important;
    direction:ltr!important;
  }
  html body #app.app-shell #view-security .security-mobile-info-row{
    display:grid!important;
    grid-template-columns:minmax(96px,34%) minmax(0,1fr)!important;
    align-items:center!important;
    gap:10px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-height:34px!important;
    padding:7px 0!important;
    margin:0!important;
    box-sizing:border-box!important;
    border-bottom:1px solid rgba(217,232,246,.92)!important;
    text-align:left!important;
    direction:ltr!important;
    writing-mode:horizontal-tb!important;
    text-orientation:mixed!important;
  }
  html body #app.app-shell #view-security .security-mobile-info-row:last-child{border-bottom:0!important;padding-bottom:0!important;}
  html body #app.app-shell #view-security .security-mobile-info-label{
    display:block!important;
    min-width:0!important;
    max-width:100%!important;
    color:#6f879f!important;
    -webkit-text-fill-color:#6f879f!important;
    font-size:9px!important;
    line-height:1.15!important;
    font-weight:900!important;
    letter-spacing:.04em!important;
    text-transform:uppercase!important;
    text-align:left!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:anywhere!important;
    writing-mode:horizontal-tb!important;
    text-orientation:mixed!important;
  }
  html body #app.app-shell #view-security .security-mobile-info-value{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    min-width:0!important;
    max-width:100%!important;
    color:#10233a!important;
    -webkit-text-fill-color:#10233a!important;
    font-size:12px!important;
    line-height:1.35!important;
    font-weight:800!important;
    text-align:left!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:anywhere!important;
    writing-mode:horizontal-tb!important;
    text-orientation:mixed!important;
  }
  html body #app.app-shell #view-security .security-mobile-info-value > *,
  html body #app.app-shell #view-security .security-mobile-info-value strong,
  html body #app.app-shell #view-security .security-mobile-info-value span,
  html body #app.app-shell #view-security .security-mobile-info-value div{
    max-width:100%!important;
    min-width:0!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:anywhere!important;
    writing-mode:horizontal-tb!important;
    text-orientation:mixed!important;
  }
  html body #app.app-shell #view-security .security-mobile-info-value .security-table-pill{
    display:inline-flex!important;
    width:auto!important;
    max-width:100%!important;
    white-space:nowrap!important;
    overflow-wrap:normal!important;
  }
  html body #app.app-shell #view-security .security-mobile-info-row.actions .security-mobile-info-value,
  html body #app.app-shell #view-security .security-mobile-info-row.actions .security-action-row{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:8px!important;
    flex-wrap:wrap!important;
    width:auto!important;
  }
  html[dir="rtl"] body #app.app-shell #view-security .security-ip-mobile-card,
  body.kls-rtl #app.app-shell #view-security .security-ip-mobile-card{
    direction:rtl!important;
  }
  html[dir="rtl"] body #app.app-shell #view-security .security-mobile-info-row,
  body.kls-rtl #app.app-shell #view-security .security-mobile-info-row{
    grid-template-columns:minmax(0,1fr) minmax(96px,34%)!important;
    direction:rtl!important;
    text-align:right!important;
  }
  html[dir="rtl"] body #app.app-shell #view-security .security-mobile-info-label,
  body.kls-rtl #app.app-shell #view-security .security-mobile-info-label{
    grid-column:2!important;
    grid-row:1!important;
    text-align:right!important;
  }
  html[dir="rtl"] body #app.app-shell #view-security .security-mobile-info-value,
  body.kls-rtl #app.app-shell #view-security .security-mobile-info-value{
    grid-column:1!important;
    grid-row:1!important;
    justify-content:flex-end!important;
    text-align:right!important;
    direction:rtl!important;
  }
  html[dir="rtl"] body #app.app-shell #view-security .security-mobile-info-row.actions .security-action-row,
  body.kls-rtl #app.app-shell #view-security .security-mobile-info-row.actions .security-action-row{
    justify-content:flex-end!important;
  }
  html body #app.app-shell.dark #view-security .security-ip-mobile-card,
  html body.theme-dark #app.app-shell #view-security .security-ip-mobile-card{
    background:linear-gradient(180deg,#07131f 0%,#091827 100%)!important;
    border-color:#244057!important;
    outline:0!important;
    box-shadow:none!important;
  }
  html body #app.app-shell.dark #view-security .security-mobile-info-row,
  html body.theme-dark #app.app-shell #view-security .security-mobile-info-row{border-bottom-color:#20364f!important;}
  html body #app.app-shell.dark #view-security .security-mobile-info-value,
  html body.theme-dark #app.app-shell #view-security .security-mobile-info-value,
  html body #app.app-shell.dark #view-security .security-mobile-info-value strong,
  html body.theme-dark #app.app-shell #view-security .security-mobile-info-value strong{color:#d9e8f7!important;-webkit-text-fill-color:#d9e8f7!important;}
}

/* V3.0.71 — Security View More/View All uniform color, size, and weight only */
html body #app.app-shell #view-security .security-link-btn,
html body #app.app-shell #view-security .security-view-more,
html body #app.app-shell #view-security .security-table-more .security-view-more,
html body #app.app-shell #view-security [data-security-section="advanced"] .security-view-more,
html body #app.app-shell #view-security [data-security-section="advanced"] #securityTopAgents .security-view-more,
html body #app.app-shell #view-security #securityHotIpProfiles .security-view-more,
html body #app.app-shell #view-security #securityThreatActors .security-view-more,
html body #app.app-shell #view-security #securityTopAgents .security-view-more,
html body #app.app-shell #view-security #securityRecentEvents .security-view-more,
html body #app.app-shell #view-security [data-security-view-more]{
  font-family:inherit!important;
  font-size:13px!important;
  line-height:1.25!important;
  font-weight:800!important;
  letter-spacing:0!important;
  text-transform:none!important;
  color:#087ef2!important;
  -webkit-text-fill-color:#087ef2!important;
  text-decoration:none!important;
  text-align:center!important;
  white-space:nowrap!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  cursor:pointer!important;
}
html body #app.app-shell #view-security .security-link-btn:hover,
html body #app.app-shell #view-security .security-view-more:hover,
html body #app.app-shell #view-security .security-table-more .security-view-more:hover,
html body #app.app-shell #view-security [data-security-section="advanced"] .security-view-more:hover,
html body #app.app-shell #view-security [data-security-view-more]:hover{
  color:#087ef2!important;
  -webkit-text-fill-color:#087ef2!important;
  text-decoration:none!important;
}
html body #app.app-shell.dark #view-security .security-link-btn,
html body.theme-dark #app.app-shell #view-security .security-link-btn,
html body #app.app-shell.dark #view-security .security-view-more,
html body.theme-dark #app.app-shell #view-security .security-view-more,
html body #app.app-shell.dark #view-security .security-table-more .security-view-more,
html body.theme-dark #app.app-shell #view-security .security-table-more .security-view-more,
html body #app.app-shell.dark #view-security [data-security-section="advanced"] .security-view-more,
html body.theme-dark #app.app-shell #view-security [data-security-section="advanced"] .security-view-more,
html body #app.app-shell.dark #view-security [data-security-view-more],
html body.theme-dark #app.app-shell #view-security [data-security-view-more]{
  color:#25c7ff!important;
  -webkit-text-fill-color:#25c7ff!important;
}
html body #app.app-shell.dark #view-security .security-link-btn:hover,
html body.theme-dark #app.app-shell #view-security .security-link-btn:hover,
html body #app.app-shell.dark #view-security .security-view-more:hover,
html body.theme-dark #app.app-shell #view-security .security-view-more:hover,
html body #app.app-shell.dark #view-security [data-security-view-more]:hover,
html body.theme-dark #app.app-shell #view-security [data-security-view-more]:hover{
  color:#25c7ff!important;
  -webkit-text-fill-color:#25c7ff!important;
  text-decoration:none!important;
}
@media (max-width: 700px){
  html body #app.app-shell #view-security .security-link-btn,
  html body #app.app-shell #view-security .security-view-more,
  html body #app.app-shell #view-security .security-table-more .security-view-more,
  html body #app.app-shell #view-security [data-security-section="advanced"] .security-view-more,
  html body #app.app-shell #view-security [data-security-view-more]{
    font-size:13px!important;
    line-height:1.25!important;
    font-weight:800!important;
    color:#087ef2!important;
    -webkit-text-fill-color:#087ef2!important;
  }
  html body #app.app-shell.dark #view-security .security-link-btn,
  html body.theme-dark #app.app-shell #view-security .security-link-btn,
  html body #app.app-shell.dark #view-security .security-view-more,
  html body.theme-dark #app.app-shell #view-security .security-view-more,
  html body #app.app-shell.dark #view-security [data-security-view-more],
  html body.theme-dark #app.app-shell #view-security [data-security-view-more]{
    color:#25c7ff!important;
    -webkit-text-fill-color:#25c7ff!important;
  }
}

/* V3.0.72 — Security table header RTL/LTR direction polish (desktop + mobile + modal) */
html[dir="ltr"] #view-security .security-table-wrap,
html[dir="ltr"] #view-security .security-table-wrap table,
html[dir="ltr"] .security-more-modal .security-more-table-wrap,
html[dir="ltr"] .security-more-modal .security-more-table{
  direction:ltr!important;
}
html[dir="ltr"] #view-security .security-table-wrap th,
html[dir="ltr"] #view-security .security-table-wrap td,
html[dir="ltr"] .security-more-modal .security-more-table th,
html[dir="ltr"] .security-more-modal .security-more-table td{
  text-align:left!important;
}
html[dir="rtl"] #view-security .security-table-wrap,
html[dir="rtl"] #view-security .security-table-wrap table,
html[dir="rtl"] .security-more-modal .security-more-table-wrap,
html[dir="rtl"] .security-more-modal .security-more-table,
body.kls-rtl #view-security .security-table-wrap,
body.kls-rtl #view-security .security-table-wrap table,
body.kls-rtl .security-more-modal .security-more-table-wrap,
body.kls-rtl .security-more-modal .security-more-table{
  direction:rtl!important;
}
html[dir="rtl"] #view-security .security-table-wrap th,
html[dir="rtl"] #view-security .security-table-wrap td,
html[dir="rtl"] .security-more-modal .security-more-table th,
html[dir="rtl"] .security-more-modal .security-more-table td,
body.kls-rtl #view-security .security-table-wrap th,
body.kls-rtl #view-security .security-table-wrap td,
body.kls-rtl .security-more-modal .security-more-table th,
body.kls-rtl .security-more-modal .security-more-table td{
  text-align:right!important;
  unicode-bidi:plaintext!important;
}
html[dir="rtl"] #view-security .security-table-wrap th,
body.kls-rtl #view-security .security-table-wrap th,
html[dir="rtl"] .security-more-modal .security-more-table th,
body.kls-rtl .security-more-modal .security-more-table th{
  letter-spacing:.035em!important;
}
html[dir="rtl"] #view-security .security-table-wrap .action-row,
html[dir="rtl"] .security-more-modal .security-more-table .action-row,
body.kls-rtl #view-security .security-table-wrap .action-row,
body.kls-rtl .security-more-modal .security-more-table .action-row{
  justify-content:flex-start!important;
  direction:rtl!important;
}
@media (max-width:760px){
  html[dir="rtl"] .security-more-modal .security-more-table-wrap,
  body.kls-rtl .security-more-modal .security-more-table-wrap{
    direction:rtl!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
  html[dir="rtl"] .security-more-modal .security-more-table,
  body.kls-rtl .security-more-modal .security-more-table{
    direction:rtl!important;
    min-width:720px!important;
  }
  html[dir="ltr"] .security-more-modal .security-more-table-wrap{
    direction:ltr!important;
  }
}

/* V3.0.74 — Settings mobile action buttons row fix
   Scope: Settings page hero buttons only.
   Keeps Collapse All and Expand All side-by-side on mobile to save vertical space. */
@media (max-width: 900px){
  html body #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions,
  html body #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions.kls-settings-actions-v43,
  html body #view-settings .settings-pro-head.kls-page-hero > div.settings-pro-head-actions{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    width:100%!important;
    max-width:100%!important;
    gap:10px!important;
    align-items:stretch!important;
    justify-content:stretch!important;
    flex:0 0 auto!important;
    flex-wrap:nowrap!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions > .settings-top-action,
  html body #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions > button,
  html body #view-settings .settings-pro-head.kls-page-hero > div.settings-pro-head-actions > .settings-top-action{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    flex:unset!important;
    flex-basis:auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    height:44px!important;
    min-height:44px!important;
    padding:0 10px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    box-sizing:border-box!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions > .settings-top-action span,
  html body #view-settings .settings-pro-head.kls-page-hero > div.settings-pro-head-actions > .settings-top-action span{
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
}
@media (max-width: 380px){
  html body #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions,
  html body #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions.kls-settings-actions-v43,
  html body #view-settings .settings-pro-head.kls-page-hero > div.settings-pro-head-actions{
    gap:8px!important;
  }
  html body #view-settings .settings-pro-head.kls-page-hero > .settings-pro-head-actions > .settings-top-action,
  html body #view-settings .settings-pro-head.kls-page-hero > div.settings-pro-head-actions > .settings-top-action{
    font-size:11.5px!important;
    padding:0 7px!important;
  }
}

/* V3.0.76 — Settings Sidebar Menu Manager unified row line polish
   Scope only: Settings > Sidebar Menu Manager table. */
#view-settings .settings-menu-table{border-collapse:collapse!important;border-spacing:0!important;table-layout:fixed!important;}
#view-settings .settings-menu-table thead tr,#view-settings .settings-menu-table tbody tr{height:58px!important;}
#view-settings .settings-menu-table th,#view-settings .settings-menu-table td{display:table-cell!important;vertical-align:middle!important;height:58px!important;min-height:0!important;padding:8px 10px!important;border-bottom:1px solid #e6eef6!important;box-sizing:border-box!important;line-height:1.25!important;}
#view-settings .settings-menu-table tbody tr:last-child td{border-bottom:0!important;}
#view-settings .settings-menu-table td.settings-order-cell{display:table-cell!important;height:58px!important;min-height:0!important;padding:8px 10px!important;vertical-align:middle!important;}
#view-settings .settings-menu-table .settings-order-inner{width:100%!important;height:40px!important;min-height:40px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;margin:0 auto!important;line-height:1!important;}
#view-settings .settings-menu-table .settings-drag-handle,#view-settings .settings-menu-table .settings-order-number,#view-settings .settings-menu-table .settings-row-icon,#view-settings .settings-menu-table .settings-small-btn,#view-settings .settings-menu-table .settings-icon-upload-btn,#view-settings .settings-menu-table .settings-toggle,#view-settings .settings-menu-table .settings-menu-name{position:relative!important;top:auto!important;bottom:auto!important;margin-top:0!important;margin-bottom:0!important;transform:none!important;align-self:center!important;}
#view-settings .settings-menu-table .settings-drag-handle{width:30px!important;height:30px!important;min-width:30px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;}
#view-settings .settings-menu-table .settings-order-number{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-width:20px!important;height:30px!important;line-height:30px!important;font-weight:700!important;}
#view-settings .settings-menu-table .settings-menu-name{min-height:38px!important;height:38px!important;}
html[dir="rtl"] #view-settings .settings-menu-table-wrap,html[dir="rtl"] #view-settings .settings-menu-table,body.kls-rtl #view-settings .settings-menu-table-wrap,body.kls-rtl #view-settings .settings-menu-table{direction:rtl!important;}
html[dir="ltr"] #view-settings .settings-menu-table-wrap,html[dir="ltr"] #view-settings .settings-menu-table,body.kls-ltr #view-settings .settings-menu-table-wrap,body.kls-ltr #view-settings .settings-menu-table{direction:ltr!important;}
html[dir="rtl"] #view-settings .settings-menu-table th,html[dir="rtl"] #view-settings .settings-menu-table td,body.kls-rtl #view-settings .settings-menu-table th,body.kls-rtl #view-settings .settings-menu-table td{text-align:center!important;}
body.theme-dark #view-settings .settings-menu-table th,body.theme-dark #view-settings .settings-menu-table td,#app.app-shell.dark #view-settings .settings-menu-table th,#app.app-shell.dark #view-settings .settings-menu-table td{border-bottom-color:rgba(148,181,210,.22)!important;}
@media (max-width:760px){#view-settings .settings-menu-table thead tr,#view-settings .settings-menu-table tbody tr,#view-settings .settings-menu-table th,#view-settings .settings-menu-table td,#view-settings .settings-menu-table td.settings-order-cell{height:56px!important;}#view-settings .settings-menu-table .settings-order-inner{height:38px!important;min-height:38px!important;}}


/* V3.0.78 — Collapsed Sidebar Tooltip LTR / RTL PRO Match
   Scope only: collapsed sidebar hover labels. Rebuilds the tooltip outside the icon button,
   keeps icons centered, and mirrors tooltip direction for EN/LTR and KU/AR RTL. */
@media (min-width:901px){
  body.sidebar-collapsed .app-shell{
    overflow:visible!important;
  }
  body.sidebar-collapsed .sidebar{
    overflow:visible!important;
    z-index:2300!important;
    isolation:isolate!important;
  }
  body.sidebar-collapsed .brand-head,
  body.sidebar-collapsed .brand-main,
  body.sidebar-collapsed .nav-grid{
    overflow:visible!important;
  }
  body.sidebar-collapsed .nav-grid{
    position:relative!important;
    z-index:2302!important;
  }
  body.sidebar-collapsed .nav-btn{
    position:relative!important;
    overflow:visible!important;
    justify-content:center!important;
    align-items:center!important;
    text-align:center!important;
    z-index:1!important;
  }
  body.sidebar-collapsed .nav-btn:hover,
  body.sidebar-collapsed .nav-btn:focus-visible{
    z-index:2405!important;
  }
  body.sidebar-collapsed .nav-btn .nav-icon{
    margin:0!important;
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    transform:none!important;
  }
  body.sidebar-collapsed .nav-btn .nav-label{
    display:none!important;
  }
  body.sidebar-collapsed .nav-btn::after{
    content:attr(data-label)!important;
    position:absolute!important;
    top:50%!important;
    left:calc(100% + 12px)!important;
    right:auto!important;
    inset-inline-start:auto!important;
    inset-inline-end:auto!important;
    transform:translateY(-50%) translateX(-2px)!important;
    min-width:max-content!important;
    max-width:min(260px,42vw)!important;
    width:max-content!important;
    padding:9px 13px!important;
    border-radius:11px!important;
    background:linear-gradient(135deg,#07192d 0%,#082749 100%)!important;
    color:#fff!important;
    border:1px solid rgba(45,134,255,.28)!important;
    box-shadow:0 16px 34px rgba(4,23,43,.25),0 3px 8px rgba(4,23,43,.12)!important;
    font-size:12.5px!important;
    line-height:1.2!important;
    font-weight:800!important;
    letter-spacing:.01em!important;
    white-space:nowrap!important;
    text-align:center!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    z-index:99999!important;
    transition:opacity .16s ease,visibility .16s ease,transform .16s ease!important;
  }
  body.sidebar-collapsed .nav-btn::before{
    content:""!important;
    position:absolute!important;
    top:50%!important;
    left:calc(100% + 6px)!important;
    right:auto!important;
    width:10px!important;
    height:10px!important;
    background:#07192d!important;
    border-left:1px solid rgba(45,134,255,.28)!important;
    border-bottom:1px solid rgba(45,134,255,.28)!important;
    transform:translateY(-50%) rotate(45deg)!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    z-index:99998!important;
    transition:opacity .16s ease,visibility .16s ease!important;
  }
  body.sidebar-collapsed .nav-btn:hover::after,
  body.sidebar-collapsed .nav-btn:focus-visible::after{
    opacity:1!important;
    visibility:visible!important;
    transform:translateY(-50%) translateX(0)!important;
  }
  body.sidebar-collapsed .nav-btn:hover::before,
  body.sidebar-collapsed .nav-btn:focus-visible::before{
    opacity:1!important;
    visibility:visible!important;
  }
  html[dir="rtl"] body.sidebar-collapsed .nav-btn::after,
  body.kls-rtl.sidebar-collapsed .nav-btn::after{
    left:auto!important;
    right:calc(100% + 12px)!important;
    transform:translateY(-50%) translateX(2px)!important;
    text-align:center!important;
    direction:rtl!important;
  }
  html[dir="rtl"] body.sidebar-collapsed .nav-btn::before,
  body.kls-rtl.sidebar-collapsed .nav-btn::before{
    left:auto!important;
    right:calc(100% + 6px)!important;
    border-left:0!important;
    border-bottom:0!important;
    border-right:1px solid rgba(45,134,255,.28)!important;
    border-top:1px solid rgba(45,134,255,.28)!important;
    transform:translateY(-50%) rotate(45deg)!important;
  }
  html[dir="rtl"] body.sidebar-collapsed .nav-btn:hover::after,
  html[dir="rtl"] body.sidebar-collapsed .nav-btn:focus-visible::after,
  body.kls-rtl.sidebar-collapsed .nav-btn:hover::after,
  body.kls-rtl.sidebar-collapsed .nav-btn:focus-visible::after{
    transform:translateY(-50%) translateX(0)!important;
  }
  body.sidebar-collapsed .nav-btn.active::after{
    background:linear-gradient(135deg,#061a32 0%,#0a315f 100%)!important;
  }
  body.theme-dark.sidebar-collapsed .nav-btn::after,
  #app.app-shell.dark body.sidebar-collapsed .nav-btn::after{
    background:linear-gradient(135deg,#061421 0%,#08233b 100%)!important;
    border-color:rgba(66,179,255,.34)!important;
    box-shadow:0 18px 38px rgba(0,0,0,.42)!important;
  }
  body.theme-dark.sidebar-collapsed .nav-btn::before{
    background:#061421!important;
    border-color:rgba(66,179,255,.34)!important;
  }
}
@media (max-width:900px){
  body.sidebar-collapsed .nav-btn::before,
  body.sidebar-collapsed .nav-btn::after,
  .nav-btn::before,
  .nav-btn::after{
    display:none!important;
  }
}


/* V3.0.79 — Collapsed sidebar real scroll restore
   Scope only: collapsed desktop sidebar. Keeps the Install App ghost hidden, but restores
   a usable scroll area so every collapsed menu icon can be reached. The fixed tooltip
   remains outside the sidebar, so clipping is not needed. */
@media (min-width:901px){
  html body.sidebar-collapsed #app.app-shell #appSidebar{
    overflow:hidden!important;
    height:calc(100vh - 36px)!important;
    max-height:calc(100vh - 36px)!important;
    display:flex!important;
    flex-direction:column!important;
  }
  html body.sidebar-collapsed #app.app-shell #appSidebar .brand-head{
    flex:0 0 auto!important;
  }
  html body.sidebar-collapsed #app.app-shell #appSidebar .nav-grid{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    padding-bottom:14px!important;
    padding-inline:0 3px!important;
    scrollbar-width:thin!important;
    scrollbar-color:rgba(103,128,143,.42) transparent!important;
  }
  html body.sidebar-collapsed #app.app-shell #appSidebar .nav-grid::-webkit-scrollbar{
    display:block!important;
    width:7px!important;
    height:7px!important;
    background:transparent!important;
  }
  html body.sidebar-collapsed #app.app-shell #appSidebar .nav-grid::-webkit-scrollbar-thumb{
    display:block!important;
    width:7px!important;
    min-height:36px!important;
    border-radius:999px!important;
    background:rgba(103,128,143,.38)!important;
    border:2px solid transparent!important;
    background-clip:padding-box!important;
  }
  html body.sidebar-collapsed #app.app-shell #appSidebar .nav-grid::-webkit-scrollbar-track{
    display:block!important;
    background:transparent!important;
  }
  html body.sidebar-collapsed #app.app-shell #appSidebar .sidebar-controls,
  html body.sidebar-collapsed #app.app-shell #appSidebar .sidebar-controls *,
  html body.sidebar-collapsed #app.app-shell #appSidebar .sidebar-controls-minimal,
  html body.sidebar-collapsed #app.app-shell #appSidebar .sidebar-controls-minimal *,
  html body.sidebar-collapsed #app.app-shell #appSidebar #installBtn{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    width:0!important;
    height:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    pointer-events:none!important;
  }
  body.theme-dark.sidebar-collapsed #app.app-shell #appSidebar .nav-grid,
  #app.app-shell.dark body.sidebar-collapsed #appSidebar .nav-grid{
    scrollbar-color:rgba(119,169,198,.48) transparent!important;
  }
  body.theme-dark.sidebar-collapsed #app.app-shell #appSidebar .nav-grid::-webkit-scrollbar-thumb{
    background:rgba(119,169,198,.42)!important;
  }
}

/* V3.0.91 — Template Designer custom file input translation support */
.phase6-file-field .phase6-file-control{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
}
.phase6-file-field .phase6-file-control em{
  flex:1;
  min-width:0;
  font-style:normal;
  font-weight:800;
  color:var(--muted,#64748b);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.phase6-file-field .phase6-real-file{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}
[dir="rtl"] .phase6-file-field .phase6-file-control{
  flex-direction:row-reverse;
}


/* V3.0.93 — Template Designer translated file picker/button polish */
#view-templates .phase6-logo-tools{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
  min-width:0;
}
#view-templates .phase6-file-field{
  min-width:0;
  overflow:hidden;
}
#view-templates .phase6-file-field>span{
  display:block;
  white-space:normal;
  line-height:1.45;
  overflow-wrap:anywhere;
}
#view-templates .phase6-file-field .phase6-file-control{
  display:grid!important;
  grid-template-columns:minmax(118px,auto) minmax(0,1fr);
  align-items:center;
  gap:10px;
  width:100%;
  min-width:0;
}
[dir="rtl"] #view-templates .phase6-file-field .phase6-file-control{
  grid-template-columns:minmax(0,1fr) minmax(118px,auto);
}
#view-templates .phase6-file-btn,
#view-templates .phase6-brand-logo-btn{
  min-height:44px!important;
  border:1px solid #b9d8ff!important;
  background:linear-gradient(180deg,#eef7ff,#e5f2ff)!important;
  color:#0b72f0!important;
  font-weight:900!important;
  border-radius:16px!important;
  box-shadow:0 10px 24px rgba(14,116,218,.08)!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  line-height:1.2!important;
  padding:10px 14px!important;
}
#view-templates .phase6-file-field .phase6-file-control em{
  min-width:0!important;
  max-width:100%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  color:#60758d!important;
  font-weight:800!important;
}
#view-templates .phase6-brand-logo-btn{
  width:100%;
  justify-content:center;
  min-height:48px!important;
}
body.theme-dark #view-templates .phase6-file-btn,
body.theme-dark #view-templates .phase6-brand-logo-btn,
.app-shell.dark #view-templates .phase6-file-btn,
.app-shell.dark #view-templates .phase6-brand-logo-btn{
  background:linear-gradient(180deg,#103047,#0c263a)!important;
  border-color:#3c7896!important;
  color:#eaf7ff!important;
  box-shadow:none!important;
}
body.theme-dark #view-templates .phase6-file-field .phase6-file-control em,
.app-shell.dark #view-templates .phase6-file-field .phase6-file-control em{
  color:#a9c3d5!important;
}
@media (max-width:720px){
  #view-templates .phase6-file-field .phase6-file-control,
  [dir="rtl"] #view-templates .phase6-file-field .phase6-file-control{
    grid-template-columns:1fr!important;
  }
  #view-templates .phase6-file-btn,
  #view-templates .phase6-brand-logo-btn{
    width:100%;
  }
  #view-templates .phase6-file-field .phase6-file-control em{
    text-align:center;
  }
}

/* V3.0.93 — Template Designer upload/action button visibility polish only */
#view-templates .phase6-logo-tools .phase6-file-control,
[dir="rtl"] #view-templates .phase6-logo-tools .phase6-file-control{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:8px!important;
  width:100%!important;
  min-width:0!important;
}
#view-templates .phase6-logo-tools .phase6-file-btn,
#view-templates .phase6-logo-tools .phase6-brand-logo-btn{
  width:100%!important;
  max-width:100%!important;
  min-height:42px!important;
  padding:9px 12px!important;
  border-radius:15px!important;
  border:1px solid #78c8ff!important;
  background:linear-gradient(180deg,#e9f8ff 0%,#d5f1ff 100%)!important;
  color:#063a67!important;
  font-size:12px!important;
  font-weight:950!important;
  line-height:1.25!important;
  letter-spacing:.01em!important;
  text-align:center!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  box-shadow:0 10px 22px rgba(14,165,233,.14)!important;
}
#view-templates .phase6-logo-tools .phase6-file-btn:hover,
#view-templates .phase6-logo-tools .phase6-brand-logo-btn:hover{
  background:linear-gradient(180deg,#dff5ff 0%,#c5eaff 100%)!important;
  border-color:#42b6f4!important;
  transform:translateY(-1px);
}
#view-templates .phase6-logo-tools .phase6-file-control em{
  width:100%!important;
  max-width:100%!important;
  min-height:32px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:6px 8px!important;
  border:1px dashed #b8dcf7!important;
  border-radius:12px!important;
  background:#f8fcff!important;
  color:#526b82!important;
  font-size:11px!important;
  font-weight:850!important;
  line-height:1.25!important;
  text-align:center!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  text-overflow:clip!important;
}
html[dir="rtl"] #view-templates .phase6-logo-tools .phase6-file-btn,
html[dir="rtl"] #view-templates .phase6-logo-tools .phase6-brand-logo-btn,
html[dir="rtl"] #view-templates .phase6-logo-tools .phase6-file-control em{
  font-size:11px!important;
  line-height:1.35!important;
}
body.theme-dark #view-templates .phase6-logo-tools .phase6-file-btn,
body.theme-dark #view-templates .phase6-logo-tools .phase6-brand-logo-btn,
.app-shell.dark #view-templates .phase6-logo-tools .phase6-file-btn,
.app-shell.dark #view-templates .phase6-logo-tools .phase6-brand-logo-btn{
  background:linear-gradient(180deg,#114264 0%,#0d324d 100%)!important;
  border-color:#46b5e9!important;
  color:#f1fbff!important;
  box-shadow:0 10px 24px rgba(0,0,0,.22)!important;
}
body.theme-dark #view-templates .phase6-logo-tools .phase6-file-control em,
.app-shell.dark #view-templates .phase6-logo-tools .phase6-file-control em{
  background:#0b2032!important;
  border-color:#315f78!important;
  color:#bdd6e7!important;
}
@media (max-width:720px){
  #view-templates .phase6-logo-tools .phase6-file-btn,
  #view-templates .phase6-logo-tools .phase6-brand-logo-btn{
    min-height:40px!important;
    font-size:11px!important;
    padding:8px 10px!important;
  }
}


/* V3.0.94 — Template Designer image upload actions + brighter button visibility */
#view-templates .phase6-logo-tools .phase6-logo-action-row{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:8px!important;
  width:100%!important;
  min-width:0!important;
}
#view-templates .phase6-logo-tools .phase6-file-btn,
#view-templates .phase6-logo-tools .phase6-brand-logo-btn,
#view-templates .phase6-logo-tools .phase6-remove-logo-btn{
  width:100%!important;
  max-width:100%!important;
  min-height:44px!important;
  padding:10px 12px!important;
  border-radius:15px!important;
  border:1px solid #42b8ff!important;
  background:linear-gradient(180deg,#dff6ff 0%,#bfeeff 100%)!important;
  color:#06395f!important;
  font-size:12px!important;
  font-weight:950!important;
  line-height:1.25!important;
  text-align:center!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  box-shadow:0 10px 24px rgba(14,165,233,.20)!important;
}
#view-templates .phase6-logo-tools .phase6-file-btn:hover,
#view-templates .phase6-logo-tools .phase6-brand-logo-btn:hover{
  background:linear-gradient(180deg,#d0f2ff 0%,#aee5ff 100%)!important;
  border-color:#149be8!important;
}
#view-templates .phase6-logo-tools .phase6-remove-logo-btn{
  background:linear-gradient(180deg,#fff6f7 0%,#ffe8ec 100%)!important;
  border-color:#ff9dad!important;
  color:#a4122d!important;
  box-shadow:0 10px 24px rgba(244,63,94,.12)!important;
}
#view-templates .phase6-logo-tools .phase6-remove-logo-btn:hover{
  background:linear-gradient(180deg,#ffedf0 0%,#ffd9df 100%)!important;
  border-color:#fb7185!important;
}
#view-templates .phase6-logo-tools .phase6-file-control em{
  background:#f1fbff!important;
  border-color:#9bdcff!important;
  color:#31556f!important;
}
#view-templates .drag-item.image.is-empty-image{
  background:repeating-linear-gradient(45deg, rgba(148,163,184,.12), rgba(148,163,184,.12) 6px, rgba(255,255,255,.28) 6px, rgba(255,255,255,.28) 12px)!important;
  border:1px dashed rgba(100,116,139,.55)!important;
}
html[dir="rtl"] #view-templates .phase6-logo-tools .phase6-file-btn,
html[dir="rtl"] #view-templates .phase6-logo-tools .phase6-brand-logo-btn,
html[dir="rtl"] #view-templates .phase6-logo-tools .phase6-remove-logo-btn{
  font-size:11px!important;
  line-height:1.35!important;
  padding:9px 10px!important;
}
body.theme-dark #view-templates .phase6-logo-tools .phase6-file-btn,
body.theme-dark #view-templates .phase6-logo-tools .phase6-brand-logo-btn,
.app-shell.dark #view-templates .phase6-logo-tools .phase6-file-btn,
.app-shell.dark #view-templates .phase6-logo-tools .phase6-brand-logo-btn{
  background:linear-gradient(180deg,#15577f 0%,#0e4163 100%)!important;
  border-color:#52c7ff!important;
  color:#f3fbff!important;
  box-shadow:0 10px 24px rgba(0,0,0,.26)!important;
}
body.theme-dark #view-templates .phase6-logo-tools .phase6-remove-logo-btn,
.app-shell.dark #view-templates .phase6-logo-tools .phase6-remove-logo-btn{
  background:linear-gradient(180deg,#4b1320 0%,#35101a 100%)!important;
  border-color:#fb7185!important;
  color:#ffe7ec!important;
}
@media (min-width:1280px){
  #view-templates .phase6-logo-tools .phase6-logo-action-row{
    grid-template-columns:1fr!important;
  }
}
@media (max-width:720px){
  #view-templates .phase6-logo-tools .phase6-file-btn,
  #view-templates .phase6-logo-tools .phase6-brand-logo-btn,
  #view-templates .phase6-logo-tools .phase6-remove-logo-btn{
    min-height:42px!important;
    font-size:11px!important;
    padding:9px 10px!important;
  }
}


/* V1.0 — Print double-frame fix
   Keep one clean outer label frame in printed output. The designer previously
   added a real border plus an inset frame/pseudo-frame, which produced a
   duplicated outline in Chrome print preview. This is print-only to avoid
   changing saved template design or canvas behavior. */
@media print{
  body.printing-labels #printRoot .phase6-generated.label-paper{
    outline:0!important;
    box-shadow:none!important;
  }
  body.printing-labels #printRoot .phase6-generated.label-paper::after{
    content:none!important;
    display:none!important;
    border:0!important;
    outline:0!important;
    box-shadow:none!important;
  }
}
