/* ========================================================= 284a — SUBJECT NATIVE OBJECT FRONTEND CLONE Object Management is the source-of-truth. Subject only bridges existing DOM into Object UI language. ========================================================= */ /* --------------------------------------------------------- PAGE DENSITY --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native { color: rgba(239,246,255,.92); } /* --------------------------------------------------------- HERO — reduce oversized Subject typography --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-hero { min-height: 112px !important; padding: 20px 24px !important; margin-bottom: 14px !important; border-radius: 22px !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-hero-copy h1, body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-hero-copy h2 { font-size: 26px !important; line-height: 1.05 !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-hero-copy p { font-size: 11px !important; line-height: 1.45 !important; } body.atosy-view-subject #subject-full-page .subject-object-native-hero-actions { margin-left: auto; display: flex; gap: 8px; align-items: center; } body.atosy-view-subject #subject-full-page .subject-object-native-hero-actions button { min-height: 34px !important; padding: 7px 12px !important; font-size: 10px !important; border-radius: 11px !important; } /* --------------------------------------------------------- DASHBOARD — direct Object component classes --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page #subject-object-native-dashboard { margin-bottom: 14px; } body.atosy-view-subject #subject-full-page .object-workspace-kpis { margin-bottom: 14px; } body.atosy-view-subject #subject-full-page .object-workspace-kpi { min-height: 92px; } body.atosy-view-subject #subject-full-page .object-workspace-kpi span { font-size: 10px !important; } body.atosy-view-subject #subject-full-page .object-workspace-kpi strong { font-size: 27px !important; line-height: 1.05 !important; } body.atosy-view-subject #subject-full-page .object-workspace-kpi small { font-size: 9px !important; } body.atosy-view-subject #subject-full-page .object-workspace-panel h2 { font-size: 14px !important; margin-bottom: 14px !important; } /* --------------------------------------------------------- BARS — same density / visual language as Object --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page .subject-object-bar { display: grid; grid-template-columns: minmax(110px, 160px) minmax(0, 1fr) 42px; gap: 10px; align-items: center; min-height: 30px; } body.atosy-view-subject #subject-full-page .subject-object-bar-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: rgba(236,245,255,.90); font-size: 10px; } body.atosy-view-subject #subject-full-page .subject-object-bar-track { height: 6px; overflow: hidden; border-radius: 999px; background: rgba(111,158,218,.22); } body.atosy-view-subject #subject-full-page .subject-object-bar-track span { display: block; height: 100%; border-radius: inherit; background: linear-gradient( 90deg, rgba(77,231,205,.96), rgba(83,160,255,.96) ); } body.atosy-view-subject #subject-full-page .subject-object-bar strong { text-align: right; color: rgba(249,252,255,.96); font-size: 10px; font-weight: 800; } /* --------------------------------------------------------- ALERT CELLS --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page .object-dashboard-alert { min-height: 60px; } body.atosy-view-subject #subject-full-page .object-dashboard-alert span { font-size: 9px !important; } body.atosy-view-subject #subject-full-page .object-dashboard-alert strong { font-size: 20px !important; } body.atosy-view-subject #subject-full-page .object-dashboard-alert small { display: block; margin-top: 2px; color: rgba(180,207,239,.58); font-size: 8px; } /* --------------------------------------------------------- LOOKUP HERO — exact Object navy language --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page .subject-object-native-lookup { margin-bottom: 10px; min-height: 62px; display: grid; grid-template-columns: 190px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 10px 14px; border: 1px solid rgba(92,157,224,.32); border-radius: 18px; background: linear-gradient( 180deg, rgba(3,18,43,.999), rgba(4,31,72,.999) ) !important; background-color: rgb(4,27,63) !important; } body.atosy-view-subject #subject-full-page .subject-object-native-lookup-title h2 { margin: 0; color: #fff; font-size: 16px; font-weight: 820; } body.atosy-view-subject #subject-full-page .subject-object-native-lookup-controls { min-width: 0; display: grid; grid-template-columns: minmax(0,1fr) minmax(150px,190px); gap: 8px; align-items: center; } body.atosy-view-subject #subject-full-page .subject-object-native-lookup .subject-full-search { margin: 0 !important; width: 100% !important; } body.atosy-view-subject #subject-full-page .subject-object-native-lookup #subject-full-search-input, body.atosy-view-subject #subject-full-page .subject-object-native-lookup #subject-full-status { height: 34px !important; min-height: 34px !important; font-size: 10px !important; color: rgba(240,247,255,.92) !important; background: rgba(8,36,82,.88) !important; border: 1px solid rgba(117,173,235,.20) !important; border-radius: 10px !important; } /* --------------------------------------------------------- ORIGINAL SUBJECT GRID — DO NOT REPARENT --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page #atosy-subject-grid-v4.object-lookup-layout { grid-template-columns: minmax(0, 1fr) 340px !important; gap: 14px !important; align-items: start !important; } /* --------------------------------------------------------- REMOVE WHITE TABLE COMPLETELY --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page .subject-full-card.object-lookup-main { background: linear-gradient( 145deg, rgba(8,37,80,.50), rgba(8,31,67,.34) ) !important; border: 1px solid rgba(255,255,255,.11) !important; border-radius: 22px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 15px 32px rgba(0,0,0,.11) !important; overflow: hidden !important; } body.atosy-view-subject #subject-full-page .subject-full-card-header { display: none !important; } body.atosy-view-subject #subject-full-page .subject-full-table, body.atosy-view-subject #subject-full-page .subject-full-table tbody, body.atosy-view-subject #subject-full-page .subject-full-table tr, body.atosy-view-subject #subject-full-page .subject-full-table td { background: transparent !important; background-color: transparent !important; } body.atosy-view-subject #subject-full-page .subject-full-table tbody tr { min-height: 44px !important; border-bottom: 1px solid rgba(255,255,255,.07) !important; } body.atosy-view-subject #subject-full-page .subject-full-table tbody tr:hover { background: rgba(45,105,179,.16) !important; } body.atosy-view-subject #subject-full-page .subject-full-table th, body.atosy-view-subject #subject-full-page .subject-full-table td { padding: 10px 12px !important; font-size: 10px !important; line-height: 1.25 !important; border-color: rgba(255,255,255,.07) !important; } body.atosy-view-subject #subject-full-page .subject-full-table td { color: rgba(240,247,255,.90) !important; } body.atosy-view-subject #subject-full-page .subject-full-table thead th { color: #fff !important; font-size: 10px !important; font-weight: 800 !important; background: linear-gradient( 180deg, rgba(3,18,43,.999), rgba(4,31,72,.999) ) !important; background-color: rgb(4,27,63) !important; } /* code / name */ body.atosy-view-subject #subject-full-page .subject-full-code { color: rgba(192,221,255,.95) !important; font-size: 10px !important; } body.atosy-view-subject #subject-full-page .subject-full-name { color: rgba(244,249,255,.92) !important; font-size: 10px !important; } /* status pills less oversized */ body.atosy-view-subject #subject-full-page .subject-full-status { min-height: 20px !important; padding: 3px 7px !important; font-size: 8.5px !important; border-radius: 999px !important; } /* action arrow */ body.atosy-view-subject #subject-full-page .subject-full-table button { width: 28px !important; height: 28px !important; min-width: 28px !important; min-height: 28px !important; font-size: 10px !important; } /* --------------------------------------------------------- CLASSIFICATION — use Object panel treatment --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page #subject-classification-panel.object-classification-panel { width: auto !important; min-width: 0 !important; background: linear-gradient( 145deg, rgba(8,37,80,.50), rgba(8,31,67,.34) ) !important; border: 1px solid rgba(255,255,255,.11) !important; border-radius: 22px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 15px 32px rgba(0,0,0,.11) !important; } body.atosy-view-subject #subject-full-page #subject-classification-panel .subject-classification-head h3, body.atosy-view-subject #subject-full-page #subject-classification-panel h2 { font-size: 14px !important; } body.atosy-view-subject #subject-full-page .subject-classification-row { min-height: 32px !important; } body.atosy-view-subject #subject-full-page .subject-classification-label { min-height: 30px !important; padding: 5px 7px !important; } body.atosy-view-subject #subject-full-page .subject-classification-name { font-size: 9.5px !important; line-height: 1.25 !important; } body.atosy-view-subject #subject-full-page .subject-classification-count { min-width: 27px !important; height: 20px !important; padding: 2px 6px !important; font-size: 8.5px !important; } body.atosy-view-subject #subject-full-page .subject-classification-toggle { width: 22px !important; min-width: 22px !important; height: 26px !important; font-size: 9px !important; } /* --------------------------------------------------------- HIDE NOW-EMPTY LEGACY TOOLBAR SHELL --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page .subject-full-toolbar { min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; } /* --------------------------------------------------------- RESPONSIVE --------------------------------------------------------- */ @media (max-width: 1040px) { body.atosy-view-subject #subject-full-page #atosy-subject-grid-v4.object-lookup-layout { grid-template-columns: 1fr !important; } body.atosy-view-subject #subject-full-page .subject-object-native-lookup { grid-template-columns: 1fr; } } /* ========================================================= 284g — SUBJECT LEGACY STICKY CONFLICT CLEANUP Native Object-style Subject owns the lookup/table UI now. Disable all historical cloned/fixed Subject headers. ========================================================= */ body.atosy-view-subject #subject-full-page.subject-object-native #atosy-subject-fixed-table-header, body.atosy-view-subject #subject-full-page.subject-object-native .atosy-subject-fixed-table-header, body.atosy-view-subject #subject-full-page.subject-object-native .atosy-subject-sticky-clone, body.atosy-view-subject #subject-full-page.subject-object-native #atosy-subject-table-sticky-shell, body.atosy-view-subject #subject-full-page.subject-object-native .atosy-subject-sticky-table, body.atosy-view-subject #subject-full-page.subject-object-native .atosy-subject-sticky-list-title { display: none !important; visibility: hidden !important; pointer-events: none !important; } /* * Restore the real table header as the single source. * Sticky will be rebuilt later using the Object pattern. */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead { display: table-header-group !important; visibility: visible !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead tr { display: table-row !important; visibility: visible !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead th { position: static !important; top: auto !important; visibility: visible !important; transform: none !important; } /* * Historical hidden-header helper classes must not * hide the canonical table header anymore. */ body.atosy-view-subject #subject-full-page.subject-object-native .atosy-subject-original-header-hidden, body.atosy-view-subject #subject-full-page.subject-object-native .atosy-subject-original-thead-hidden { display: table-header-group !important; visibility: visible !important; opacity: 1 !important; } /* * Classification is temporarily normal-flow. * Native Object sticky will be added after cleanup PASS. */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel { position: relative !important; top: auto !important; transform: none !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-classification-head, body.atosy-view-subject #subject-full-page.subject-object-native .subject-classification-root { position: relative !important; top: auto !important; } /* ========================================================= 284i — SUBJECT OBJECT-STYLE STICKY CLONE Copy the working local-sticky model from Object Management. ========================================================= */ body.atosy-view-subject #subject-full-page.subject-object-native { --subject-object-sticky-top: 102px; --subject-object-lookup-height: 62px; } /* Lookup hero */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup { position: sticky !important; top: var( --subject-object-sticky-top ) !important; z-index: 80 !important; isolation: isolate; background: linear-gradient( 180deg, rgba(3,18,43,.999), rgba(4,31,72,.999) ) !important; background-color: rgb(4,27,63) !important; box-shadow: 0 12px 30px rgba(0,15,45,.24), inset 0 1px 0 rgba(255,255,255,.08) !important; backdrop-filter: blur(22px) !important; -webkit-backdrop-filter: blur(22px) !important; } /* Table header directly below lookup hero */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead th { position: sticky !important; top: calc( var( --subject-object-sticky-top ) + var( --subject-object-lookup-height ) + 12px ) !important; z-index: 72 !important; background: linear-gradient( 180deg, rgba(3,18,43,.999), rgba(4,31,72,.999) ) !important; background-color: rgb(4,27,63) !important; box-shadow: inset 0 -1px 0 rgba(255,255,255,.09), 0 8px 16px rgba(0,15,42,.16) !important; backdrop-filter: blur(18px) !important; -webkit-backdrop-filter: blur(18px) !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead th:first-child { border-top-left-radius: 14px; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead th:last-child { border-top-right-radius: 14px; } /* Classification panel aligned with table header */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel { position: sticky !important; top: calc( var( --subject-object-sticky-top ) + var( --subject-object-lookup-height ) + 12px ) !important; align-self: start !important; z-index: 65 !important; max-height: calc( 100vh - var( --subject-object-sticky-top ) - var( --subject-object-lookup-height ) - 24px ) !important; overflow: hidden !important; background: linear-gradient( 150deg, rgba(9,52,110,.98), rgba(9,42,96,.98) ) !important; box-shadow: 0 14px 32px rgba(0,17,49,.22), inset 0 1px 0 rgba(255,255,255,.08) !important; backdrop-filter: blur(22px) !important; -webkit-backdrop-filter: blur(22px) !important; } /* Let classification tree scroll inside frozen panel */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-tree { flex: 1 1 auto !important; min-height: 0 !important; max-height: none !important; overflow-y: auto !important; overscroll-behavior: contain; } /* Keep classification heading normal inside sticky panel */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-head { position: relative !important; top: auto !important; z-index: 2; } /* * Sticky blockers: * Object needed overflow:visible on desktop so the real * table header can stick relative to the page. */ @media (min-width: 1041px) { body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-card.object-lookup-main { overflow: visible !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table-wrapper.object-lookup-table-wrap { overflow: visible !important; overflow-x: visible !important; overflow-y: visible !important; } } /* Narrow layout: no sticky stack */ @media (max-width: 1040px) { body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup, body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel, body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead th { position: relative !important; top: auto !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-card.object-lookup-main { overflow: hidden !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table-wrapper.object-lookup-table-wrap { overflow-x: auto !important; overflow-y: visible !important; } } /* ========================================================= 284k — SUBJECT TABLE PILL OBJECT STYLE Remove legacy white Subject pills from list rows. ========================================================= */ /* --------------------------------------------------------- CẤP ĐỘ CHỦ THỂ --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(3) > *, body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(5) > * { background: rgba(83, 143, 212, .14) !important; background-color: rgba(83, 143, 212, .14) !important; color: rgba(229, 240, 255, .88) !important; border: 1px solid rgba(124, 174, 232, .12) !important; box-shadow: none !important; text-shadow: none !important; border-radius: 999px !important; min-height: 20px !important; padding: 3px 7px !important; font-size: 8.5px !important; font-weight: 650 !important; } /* --------------------------------------------------------- TRẠNG THÁI — neutral default --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table .subject-full-status, body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(4) > *, body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(6) > * { background: rgba(92, 137, 193, .13) !important; background-color: rgba(92, 137, 193, .13) !important; color: rgba(229, 239, 252, .84) !important; border: 1px solid rgba(131, 176, 229, .11) !important; box-shadow: none !important; text-shadow: none !important; min-height: 20px !important; padding: 3px 7px !important; border-radius: 999px !important; font-size: 8.5px !important; font-weight: 670 !important; } /* --------------------------------------------------------- Preserve semantic green state without white pill --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody tr [class*="success"], body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody tr [class*="active"] { background-color: rgba(31, 174, 122, .15) !important; color: rgba(158, 244, 205, .96) !important; border-color: rgba(79, 218, 166, .17) !important; } /* --------------------------------------------------------- Kill legacy white/light chips generically inside list rows but DO NOT touch action buttons. --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td span:not(.subject-full-code):not(.subject-full-name), body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td div:not(.subject-full-code):not(.subject-full-name) { box-shadow: none !important; } /* * Specifically neutralize very-light inherited backgrounds * from old Subject visual layers. */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(3) > *, body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(4) > * { filter: none !important; } /* Make row visual density match Object Management */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td { color: rgba(235, 244, 255, .88) !important; font-size: 10px !important; font-weight: 500 !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody tr { background: transparent !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody tr:hover { background: rgba(62, 127, 208, .10) !important; } /* ========================================================= 284n — SUBJECT TYPOGRAPHY + FILTER RESET Goal: - List data easier to read. - Classification tree smaller and denser. - Add explicit clear-filter control. ========================================================= */ /* --------------------------------------------------------- 1. LIST DATA — INCREASE READABILITY --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td { font-size: 11.25px !important; line-height: 1.35 !important; font-weight: 520 !important; padding: 11px 12px !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table .subject-full-code { font-size: 11.25px !important; font-weight: 720 !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table .subject-full-name { font-size: 11.25px !important; font-weight: 650 !important; } /* Cấp độ + Trạng thái pills */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table .subject-full-status { min-height: 22px !important; padding: 4px 8px !important; font-size: 10px !important; line-height: 1.15 !important; font-weight: 650 !important; } /* Table column header */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead th { font-size: 11px !important; line-height: 1.2 !important; font-weight: 800 !important; padding: 12px 12px !important; } /* action arrow slightly larger */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-row-action { width: 30px !important; height: 30px !important; min-width: 30px !important; min-height: 30px !important; font-size: 12px !important; } /* --------------------------------------------------------- 2. CLASSIFICATION TREE — SMALLER / DENSER --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel { font-size: 10px !important; } body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-head h2, body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-head h3 { font-size: 13px !important; line-height: 1.15 !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-classification-node { border-radius: 11px !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-classification-row { min-height: 29px !important; margin: 2px 0 !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-classification-label { min-height: 28px !important; padding: 4px 6px !important; gap: 5px !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-classification-name { font-size: 9.75px !important; line-height: 1.2 !important; font-weight: 650 !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-classification-count { min-width: 26px !important; height: 19px !important; padding: 2px 5px !important; font-size: 8.5px !important; line-height: 1 !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-classification-toggle { width: 20px !important; min-width: 20px !important; height: 24px !important; font-size: 9px !important; } /* Reduce padding inside classification body */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-root { padding: 7px 8px 10px !important; } /* --------------------------------------------------------- 3. RESET FILTER BUTTON --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-object-filter-reset { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 5px !important; min-width: 0 !important; height: 28px !important; padding: 4px 8px !important; margin: 0 !important; border: 1px solid rgba(132, 181, 238, .24) !important; border-radius: 9px !important; background: rgba(18, 62, 121, .42) !important; color: rgba(230, 241, 255, .90) !important; box-shadow: none !important; cursor: pointer !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-object-filter-reset:hover { background: rgba(39, 99, 169, .58) !important; border-color: rgba(146, 197, 250, .38) !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-object-filter-reset > span { font-size: 15px !important; line-height: 1 !important; font-weight: 500 !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-object-filter-reset > small { font-size: 8.5px !important; line-height: 1 !important; font-weight: 680 !important; color: inherit !important; } /* Keep edit + reset controls compact */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel button { font-size: 9px !important; } /* ========================================================= 284p2 — SUBJECT READABILITY + FIRST PAINT ========================================================= */ /* Hide legacy Subject presentation during route transition */ body.atosy-subject-native-pending #subject-full-page { visibility: hidden !important; } /* Main data */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td { font-size: 12.5px !important; line-height: 1.38 !important; padding: 12px 12px !important; } /* Code + name */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-code, body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-name { font-size: 12.5px !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-name { font-weight: 650 !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-code { font-weight: 750 !important; } /* Full name / email */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(3), body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(4) { font-size: 12px !important; } /* Cấp độ + Trạng thái */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table .subject-full-status { font-size: 10.75px !important; min-height: 23px !important; padding: 4px 8px !important; } /* Column headings */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead th { font-size: 11.5px !important; } /* Classification tree itself smaller */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-node .subject-classification-name, body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel [data-subject-class-select] { font-size: 9.5px !important; line-height: 1.18 !important; } /* ========================================================= 284r — SUBJECT SEARCH SINGLE BOX + WHITE TEXT Object Management parity: - wrapper has NO visible box - icon has NO separate box - input is the only rectangle - white high-contrast input text ========================================================= */ /* --------------------------------------------------------- SEARCH WRAPPER — REMOVE OUTER RECTANGLE --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup .subject-full-search { position: relative !important; display: flex !important; align-items: center !important; width: 100% !important; min-width: 0 !important; height: 36px !important; min-height: 36px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; outline: 0 !important; border-radius: 0 !important; background: transparent !important; background-color: transparent !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } /* Old hover/focus wrapper must not draw another rectangle */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup .subject-full-search:hover, body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup .subject-full-search:focus-within { border: 0 !important; outline: 0 !important; background: transparent !important; box-shadow: none !important; transform: none !important; } /* --------------------------------------------------------- SEARCH ICON — NO MINI BOX --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup .subject-full-search > span { position: absolute !important; left: 12px !important; top: 50% !important; transform: translateY(-50%) !important; z-index: 2 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 16px !important; height: 16px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; color: rgba(255,255,255,.90) !important; opacity: 1 !important; pointer-events: none !important; } /* --------------------------------------------------------- INPUT — THE ONLY VISIBLE RECTANGLE --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup #subject-full-search-input { box-sizing: border-box !important; display: block !important; width: 100% !important; min-width: 0 !important; height: 36px !important; min-height: 36px !important; margin: 0 !important; padding: 0 14px 0 38px !important; border: 1px solid rgba(126, 180, 239, .30) !important; outline: none !important; border-radius: 11px !important; background: rgba(7, 31, 70, .92) !important; background-color: rgba(7, 31, 70, .92) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important; color: #ffffff !important; caret-color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; font-size: 11px !important; font-weight: 560 !important; line-height: 1 !important; opacity: 1 !important; } /* Focus = same single rectangle, slightly clearer border */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup #subject-full-search-input:focus { border-color: rgba(145, 199, 255, .58) !important; outline: none !important; background: rgba(8, 37, 83, .98) !important; box-shadow: 0 0 0 2px rgba(66, 142, 235, .10), inset 0 1px 0 rgba(255,255,255,.055) !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; } /* --------------------------------------------------------- PLACEHOLDER — BRIGHT ENOUGH ON NAVY --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup #subject-full-search-input::placeholder { color: rgba(222, 235, 252, .72) !important; -webkit-text-fill-color: rgba(222, 235, 252, .72) !important; opacity: 1 !important; font-weight: 500 !important; } /* Browser autofill must not turn text dark */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup #subject-full-search-input:-webkit-autofill, body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup #subject-full-search-input:-webkit-autofill:hover, body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup #subject-full-search-input:-webkit-autofill:focus { -webkit-text-fill-color: #ffffff !important; caret-color: #ffffff !important; -webkit-box-shadow: 0 0 0 1000px rgb(7,31,70) inset !important; } /* ========================================================= 284t — SUBJECT PAGINATION DARK + PILL TYPOGRAPHY 1. Prev / next pagination buttons: remove white fill, make them deep navy. 2. Subject level + status pills: increase font size for readability. ========================================================= */ body.atosy-view-subject #subject-full-page.subject-object-native :is(.object-lookup-pagination, .subject-pagination, .subject-full-pagination) :is(.object-lookup-page-button, button) { background: linear-gradient( 180deg, rgba(8, 34, 78, .96), rgba(5, 27, 63, .96) ) !important; background-color: rgba(5, 27, 63, .96) !important; color: rgba(240, 247, 255, .96) !important; border: 1px solid rgba(118, 176, 239, .28) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 8px 18px rgba(0,18,48,.18) !important; } body.atosy-view-subject #subject-full-page.subject-object-native :is(.object-lookup-pagination, .subject-pagination, .subject-full-pagination) :is(.object-lookup-page-button, button):hover:not(:disabled) { background: linear-gradient( 180deg, rgba(10, 42, 94, .98), rgba(6, 31, 72, .98) ) !important; border-color: rgba(145, 199, 255, .44) !important; color: #ffffff !important; } body.atosy-view-subject #subject-full-page.subject-object-native :is(.object-lookup-pagination, .subject-pagination, .subject-full-pagination) :is(.object-lookup-page-button, button):disabled { background: rgba(10, 39, 86, .72) !important; color: rgba(226, 239, 255, .72) !important; border-color: rgba(118, 176, 239, .14) !important; box-shadow: none !important; opacity: 1 !important; } body.atosy-view-subject #subject-full-page.subject-object-native .object-lookup-page-button { min-width: 36px !important; height: 34px !important; border-radius: 12px !important; font-size: 15px !important; font-weight: 760 !important; } /* Subject level pill + status pill */ body.atosy-view-subject #subject-full-page.subject-object-native .object-lookup-table tbody td:nth-child(3) > *, body.atosy-view-subject #subject-full-page.subject-object-native .object-lookup-table tbody td:nth-child(4) > * { font-size: 10px !important; font-weight: 700 !important; line-height: 1.12 !important; min-height: 22px !important; padding: 0 10px !important; border-radius: 999px !important; } body.atosy-view-subject #subject-full-page.subject-object-native .object-lookup-table tbody td:nth-child(3), body.atosy-view-subject #subject-full-page.subject-object-native .object-lookup-table tbody td:nth-child(4) { font-size: 10px !important; } /* ========================================================= 284x — SUBJECT STATUS ARROW + CATEGORY BUTTON SIZE ========================================================= */ /* --------------------------------------------------------- Move the dropdown arrow inward for "Tất cả trạng thái" --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup #subject-full-status { appearance: none !important; -webkit-appearance: none !important; -moz-appearance: none !important; padding-left: 12px !important; padding-right: 38px !important; background-image: url("data:image/svg+xml;utf8,\ \ \ ") !important; background-repeat: no-repeat !important; background-size: 10px 6px !important; background-position: right 14px center !important; } /* Hide old native expand icon where supported */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup #subject-full-status::-ms-expand { display: none !important; } /* --------------------------------------------------------- Make "Sửa Danh mục phân loại" slightly larger --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-classification-panel button, body.atosy-view-subject #subject-full-page.subject-object-native .subject-classification-panel .subject-parity-category-edit, body.atosy-view-subject #subject-full-page.subject-object-native .subject-classification-panel [data-subject-category-manager-open] { font-size: 12px !important; font-weight: 700 !important; line-height: 1.15 !important; letter-spacing: 0 !important; padding: 10px 14px !important; } /* ========================================================= 284y — SUBJECT PILL + CATEGORY EDIT FONT FINAL FIX Runtime truth: - Level = column 5 - Status = column 6 - Both use .subject-full-status ========================================================= */ /* --------------------------------------------------------- CẤP ĐỘ CHỦ THỂ — COLUMN 5 --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(5) > .subject-full-status { font-size: 10.75px !important; font-weight: 700 !important; line-height: 1.15 !important; min-height: 24px !important; padding: 4px 10px !important; } /* --------------------------------------------------------- TRẠNG THÁI — COLUMN 6 --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(6) > .subject-full-status { font-size: 10.75px !important; font-weight: 700 !important; line-height: 1.15 !important; min-height: 24px !important; padding: 4px 10px !important; } /* Keep status semantic colors */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(6) > .subject-full-status.active { color: rgba(158,244,205,.98) !important; } /* --------------------------------------------------------- SỬA DANH MỤC PHÂN LOẠI Override old blanket 9px Subject rule. --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel button.subject-object-category-edit-button { font-size: 11px !important; font-weight: 720 !important; line-height: 1.15 !important; min-height: 32px !important; padding: 7px 12px !important; letter-spacing: 0 !important; } /* ========================================================= 284aa — SUBJECT TABLE HEADER SOFT TOP RADIUS Only round the two upper corners slightly. ========================================================= */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table { border-collapse: separate !important; border-spacing: 0 !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead th:first-child { border-top-left-radius: 8px !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead th:last-child { border-top-right-radius: 8px !important; } /* Keep bottom corners square */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead th:first-child { border-bottom-left-radius: 0 !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead th:last-child { border-bottom-right-radius: 0 !important; } /* ========================================================= 284ac — SUBJECT TABLE HEADER VISIBLE RIGHT CORNER FIX Runtime structure: - visible left edge = th:nth-child(1) - visible right edge = th:nth-child(6) [Trạng thái] - th:nth-child(7) is action/blank header ========================================================= */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table { border-collapse: separate !important; border-spacing: 0 !important; } /* Left visible corner */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead tr > th:first-child { border-top-left-radius: 8px !important; overflow: hidden !important; } /* Right visible corner = TRẠNG THÁI column */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead tr > th:nth-child(6) { border-top-right-radius: 8px !important; overflow: hidden !important; } /* * The final blank/action header must not visually * extend the navy rectangle past the visible status column. */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead tr > th:nth-child(7) { background: transparent !important; background-color: transparent !important; border: 0 !important; box-shadow: none !important; } /* Bottom corners remain square */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead tr > th:first-child { border-bottom-left-radius: 0 !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead tr > th:nth-child(6) { border-bottom-right-radius: 0 !important; } /* ========================================================= 284ae — SUBJECT DASHBOARD DEEPER OBJECT TONE Make Subject dashboard darker / denser so it matches the stronger Object dashboard feel. ========================================================= */ body.atosy-view-subject #subject-full-page.subject-object-native .object-workspace-kpis .object-workspace-kpi { background: linear-gradient( 180deg, rgba(9, 47, 111, 0.97) 0%, rgba(6, 33, 82, 0.985) 100% ) !important; border: 1px solid rgba(117, 176, 239, 0.16) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,0.045), 0 12px 28px rgba(0, 17, 48, 0.18) !important; } body.atosy-view-subject #subject-full-page.subject-object-native .object-workspace-grid .object-workspace-panel { background: linear-gradient( 180deg, rgba(10, 49, 115, 0.97) 0%, rgba(7, 34, 85, 0.985) 100% ) !important; border: 1px solid rgba(117, 176, 239, 0.15) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 14px 32px rgba(0, 18, 54, 0.18) !important; } body.atosy-view-subject #subject-full-page.subject-object-native .object-dashboard-alert-grid .object-dashboard-alert, body.atosy-view-subject #subject-full-page.subject-object-native .object-workspace-panel .object-dashboard-alert { background: linear-gradient( 180deg, rgba(16, 62, 138, 0.92) 0%, rgba(10, 44, 101, 0.96) 100% ) !important; border: 1px solid rgba(117, 176, 239, 0.12) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,0.035) !important; } body.atosy-view-subject #subject-full-page.subject-object-native .object-dashboard-bar-track { background: rgba(83, 123, 189, 0.26) !important; } body.atosy-view-subject #subject-full-page.subject-object-native .object-dashboard-bar-fill { filter: saturate(1.02) brightness(1.02) !important; } body.atosy-view-subject #subject-full-page.subject-object-native .object-workspace-kpi strong, body.atosy-view-subject #subject-full-page.subject-object-native .object-workspace-panel h3, body.atosy-view-subject #subject-full-page.subject-object-native .object-dashboard-alert strong { color: rgba(244, 249, 255, 0.98) !important; } body.atosy-view-subject #subject-full-page.subject-object-native .object-workspace-kpi span, body.atosy-view-subject #subject-full-page.subject-object-native .object-dashboard-alert span, body.atosy-view-subject #subject-full-page.subject-object-native .object-workspace-panel p, body.atosy-view-subject #subject-full-page.subject-object-native .object-dashboard-bar-label, body.atosy-view-subject #subject-full-page.subject-object-native .object-dashboard-bar-value { color: rgba(228, 238, 252, 0.88) !important; } /* ========================================================= 284af — SUBJECT CLASSIFICATION ITEM FONT UP - Chỉ tăng cỡ chữ các mục phân loại trong bảng lọc bên phải - Không làm to tiêu đề panel / nút sửa danh mục ========================================================= */ body.atosy-view-subject #subject-full-page .subject-classification-panel ul li > button, body.atosy-view-subject #subject-full-page .subject-classification-panel ul li > a, body.atosy-view-subject #subject-full-page .subject-classification-panel ul li > summary, body.atosy-view-subject #subject-full-page .subject-classification-panel ul li > div, body.atosy-view-subject #subject-full-page .subject-classification-panel ul li > span { font-size: 12.25px !important; font-weight: 680 !important; line-height: 1.25 !important; } body.atosy-view-subject #subject-full-page .subject-classification-panel ul li > button *, body.atosy-view-subject #subject-full-page .subject-classification-panel ul li > a *, body.atosy-view-subject #subject-full-page .subject-classification-panel ul li > summary *, body.atosy-view-subject #subject-full-page .subject-classification-panel ul li > div *, body.atosy-view-subject #subject-full-page .subject-classification-panel ul li > span * { font-size: inherit !important; line-height: inherit !important; } body.atosy-view-subject #subject-full-page .subject-classification-panel ul li > button strong, body.atosy-view-subject #subject-full-page .subject-classification-panel ul li > a strong, body.atosy-view-subject #subject-full-page .subject-classification-panel ul li > summary strong, body.atosy-view-subject #subject-full-page .subject-classification-panel ul li > div strong, body.atosy-view-subject #subject-full-page .subject-classification-panel ul li > span strong { font-size: 12.25px !important; font-weight: 700 !important; } /* ========================================================= 284ag — SUBJECT CLASSIFICATION REAL ITEM FONT UP Runtime truth: .subject-classification-node > .subject-classification-row > .subject-classification-label > .subject-classification-name > .subject-classification-count ========================================================= */ /* Main category text */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-node > .subject-classification-row > .subject-classification-label .subject-classification-name, body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-node .subject-classification-name { font-size: 11.5px !important; font-weight: 690 !important; line-height: 1.22 !important; } /* Clickable classification label itself */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel [data-subject-class-select] { font-size: 11.5px !important; line-height: 1.22 !important; } /* Count badge: a little larger, but still secondary */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-count { font-size: 9.5px !important; font-weight: 720 !important; min-width: 27px !important; height: 20px !important; padding: 2px 6px !important; } /* Slightly increase row height to avoid cramped text */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-row { min-height: 32px !important; } /* Keep toggle compact */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-toggle { font-size: 10px !important; } /* ========================================================= 284ai — SUBJECT CLASSIFICATION INTERNAL SCROLL RESTORE Restore the same layout contract as Object Management: panel = flex column tree = flex child + internal vertical scroll ========================================================= */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel { display: flex !important; flex-direction: column !important; min-height: 0 !important; overflow: hidden !important; } /* Header / controls stay fixed inside the panel */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-head { flex: 0 0 auto !important; } /* Canonical tree scroll container */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-tree, body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel #subject-classification-tree { flex: 1 1 auto !important; min-height: 0 !important; max-height: none !important; overflow-x: hidden !important; overflow-y: auto !important; overscroll-behavior: contain !important; scrollbar-gutter: stable; } /* * The root must not steal the scroll. * It grows naturally inside the tree scroll container. */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-root { flex: 0 0 auto !important; min-height: max-content !important; overflow: visible !important; } /* Keep scrollbar usable and visible */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-tree::-webkit-scrollbar, body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel #subject-classification-tree::-webkit-scrollbar { width: 8px !important; } body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-tree::-webkit-scrollbar-track, body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel #subject-classification-tree::-webkit-scrollbar-track { background: rgba(4, 24, 58, .28) !important; border-radius: 999px !important; } body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel .subject-classification-tree::-webkit-scrollbar-thumb, body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel #subject-classification-tree::-webkit-scrollbar-thumb { background: rgba(113, 170, 234, .46) !important; border-radius: 999px !important; } /* ========================================================= 284am — SUBJECT CLASSIFICATION REAL SCROLL OWNER FIX Runtime truth: #atosy-classification-scroll-v4 is the real vertical scroll owner. #subject-classification-tree itself is NOT scrollable. ========================================================= */ /* --------------------------------------------------------- REAL SCROLL OWNER --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel #atosy-classification-scroll-v4 { flex: 1 1 auto !important; min-height: 0 !important; max-height: none !important; overflow-x: hidden !important; overflow-y: auto !important; overscroll-behavior: contain !important; scrollbar-gutter: stable !important; -webkit-overflow-scrolling: touch; } /* --------------------------------------------------------- INNER TREE IS CONTENT, NOT SCROLL OWNER --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel #atosy-classification-scroll-v4 #subject-classification-tree { flex: 0 0 auto !important; width: 100% !important; min-height: 0 !important; height: auto !important; max-height: none !important; overflow: visible !important; } /* --------------------------------------------------------- VISIBLE SCROLLBAR --------------------------------------------------------- */ body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel #atosy-classification-scroll-v4::-webkit-scrollbar { width: 8px !important; } body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel #atosy-classification-scroll-v4::-webkit-scrollbar-track { background: rgba(4, 24, 58, .34) !important; border-radius: 999px !important; } body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel #atosy-classification-scroll-v4::-webkit-scrollbar-thumb { background: rgba(122, 179, 239, .58) !important; border-radius: 999px !important; border: 1px solid rgba(7, 35, 78, .65) !important; } body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel #atosy-classification-scroll-v4::-webkit-scrollbar-thumb:hover { background: rgba(144, 198, 249, .72) !important; } /* ========================================================== 287b — SUBJECT UI TARGETED FIX Actual selectors verified in Chrome DOM. ========================================================== */ /* Make the X glyph larger without resizing the button. */ body.atosy-view-subject #subject-classification-panel button.atosy-class-close-v4 { font-size: 20px !important; font-weight: 750 !important; line-height: 1 !important; } /* Round only the two outside top table corners. */ body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead th:first-child { border-top-left-radius: 18px !important; } body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table thead th:last-child { border-top-right-radius: 18px !important; } /* 287b END */ /* ========================================================== 287f — SUBJECT UI CORRECTION Verified Subject DOM selectors. ========================================================== */ /* Classification clear X: enlarge glyph, not button. */ html body.atosy-view-subject aside#subject-classification-panel button.atosy-class-close-v4 { font-size: 20px !important; font-weight: 800 !important; line-height: 1 !important; } /* Actual left edge of the visible Subject data header. */ html body.atosy-view-subject #subject-full-page.subject-object-native table.subject-full-table thead tr > th:first-child { border-top-left-radius: 18px !important; } /* Actual right edge: Trạng thái, column six. */ html body.atosy-view-subject #subject-full-page.subject-object-native table.subject-full-table thead tr > th:nth-child(6) { border-top-right-radius: 18px !important; } /* 287f END */ /* ========================================================== 287h — SAFE SUBJECT HEADER AND CLOSE X FIX CSS only. No observer, timer or router change. ========================================================== */ /* Subject is a child module of SVOA. */ body.atosy-view-subject #atosy-nav-dashboard.is-active { color: inherit !important; background: transparent !important; box-shadow: none !important; } body.atosy-view-subject #atosy-nav-svoa { color: #fff !important; background: linear-gradient( 135deg, #168bff, #3263ff ) !important; box-shadow: 0 9px 25px rgba(20,105,255,.34), inset 0 1px 0 rgba(255,255,255,.30) !important; } /* Override the original high-specificity 9px rule. */ html body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel button.atosy-class-close-v4 { font-size: 20px !important; font-weight: 800 !important; line-height: 1 !important; } /* 287h END */ /* ========================================================== 287j — CLASSIFICATION LAYOUT STABILIZATION Fixed action row; breadcrumb below; centered close X. CSS only, no observers or route changes. ========================================================== */ body.atosy-view-subject #subject-classification-panel #atosy-classification-fixed-v4 { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; grid-template-areas: "heading heading" "total edit" "breadcrumb breadcrumb" !important; column-gap: 8px !important; row-gap: 12px !important; align-content: start !important; align-items: stretch !important; } /* Preserve title and X together at the top. */ body.atosy-view-subject #subject-classification-panel #atosy-classification-fixed-v4 > .atosy-class-head-row-v4 { grid-area: heading !important; min-width: 0 !important; margin: 0 !important; } /* Total data: fixed left position. */ body.atosy-view-subject #subject-classification-panel #atosy-classification-fixed-v4 > .atosy-class-total-v4 { grid-area: total !important; box-sizing: border-box !important; width: 100% !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; align-self: stretch !important; } /* Category manager: fixed right position. */ body.atosy-view-subject #subject-classification-panel #atosy-classification-fixed-v4 > #atosy-category-manager-btn { grid-area: edit !important; box-sizing: border-box !important; width: 100% !important; min-width: 0 !important; max-width: none !important; height: auto !important; min-height: 44px !important; margin: 0 !important; padding: 7px 8px !important; white-space: normal !important; text-align: center !important; align-self: stretch !important; } /* Breadcrumb changes content, never moves the action row. */ body.atosy-view-subject #subject-classification-panel #atosy-classification-fixed-v4 > #atosy-class-breadcrumb-slot-v4 { grid-area: breadcrumb !important; min-width: 0 !important; margin: 0 !important; } /* Center the X glyph inside its existing 36 x 36 button. */ html body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel button.atosy-class-close-v4 { display: flex !important; align-items: center !important; justify-content: center !important; place-items: center !important; box-sizing: border-box !important; width: 36px !important; height: 36px !important; min-width: 36px !important; min-height: 36px !important; padding: 0 !important; margin: 0 !important; font-size: 20px !important; line-height: 1 !important; text-align: center !important; text-indent: 0 !important; } /* 287j END */ /* ========================================================== 287l — CLASSIFICATION ORDER FIX Flatten only the fixed header wrapper into its parent grid. This allows the separate actions row to sit between the heading and breadcrumb without moving DOM nodes. ========================================================== */ html body.atosy-view-subject #subject-full-page.subject-object-native #subject-classification-panel.information-classification-layout-v2 { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: auto auto auto minmax(0, 1fr) !important; grid-template-areas: "heading" "actions" "breadcrumb" "tree" !important; align-content: stretch !important; gap: 10px !important; } /* Flatten the wrapper, retaining its child elements. */ html body.atosy-view-subject #subject-classification-panel.information-classification-layout-v2 > #atosy-classification-fixed-v4 { display: contents !important; } /* 1. Title + centered X. */ html body.atosy-view-subject #subject-classification-panel.information-classification-layout-v2 #atosy-classification-fixed-v4 > .atosy-class-head-row-v4 { grid-area: heading !important; margin: 0 !important; min-width: 0 !important; } /* 2. Two actions, side by side. */ html body.atosy-view-subject #subject-classification-panel.information-classification-layout-v2 > #information-classification-actions-row-v2, html body.atosy-view-subject #subject-classification-panel.information-classification-layout-v2 > .information-classification-actions-row-v2 { grid-area: actions !important; margin: 0 !important; min-width: 0 !important; align-self: stretch !important; } /* 3. Breadcrumb / current classification. */ html body.atosy-view-subject #subject-classification-panel.information-classification-layout-v2 #atosy-classification-fixed-v4 > #atosy-class-breadcrumb-slot-v4 { grid-area: breadcrumb !important; min-width: 0 !important; margin: 0 !important; } /* 4. Classification tree keeps its own scrolling. */ html body.atosy-view-subject #subject-classification-panel.information-classification-layout-v2 > #atosy-classification-scroll-v4 { grid-area: tree !important; min-height: 0 !important; min-width: 0 !important; } /* 287l END */ /* ========================================================== 287m — TOTAL LABEL AND HEADING SPACING 1. Always show: Tổng dữ liệu 2. More space between heading and action buttons. CSS only — works after classification re-render. ========================================================== */ /* Keep the original accessible text in the DOM. Replace only its visual rendering with two fixed lines. */ html body.atosy-view-subject #subject-classification-panel .atosy-class-total-v4 > span:first-child { font-size: 0 !important; line-height: 0 !important; white-space: normal !important; min-width: 0 !important; } html body.atosy-view-subject #subject-classification-panel .atosy-class-total-v4 > span:first-child::before { content: "Tổng\A dữ liệu" !important; display: block !important; white-space: pre !important; font-size: 11px !important; font-weight: 700 !important; line-height: 1.15 !important; text-align: left !important; } /* Extra separation after the classification title. Preserve the existing actions/breadcrumb/tree order. */ html body.atosy-view-subject #subject-classification-panel.information-classification-layout-v2 #atosy-classification-fixed-v4 > .atosy-class-head-row-v4 { margin-bottom: 8px !important; } /* 287m END */ /* ========================================================== 288a — SUBJECT STATUS CHIP + SEARCH CONTRAST 1. Give the status column more breathing room so numbered diplomatic statuses do not hug the right edge. 2. Make status chips robust for longer numbered labels. 3. Increase default contrast of the Subject search box. CSS only. ========================================================== */ /* ---------- A. SUBJECT TABLE STATUS COLUMN ---------- */ /* Give the visible status column more right padding. */ html body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(6) { padding-right: 24px !important; } /* Keep the status pill comfortably inside the cell. */ html body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(6) > * { max-width: calc(100% - 8px) !important; } /* Robust pill sizing for numbered statuses such as: 1. Chưa liên lạc / 3. Đang đàm phán / 4. Đang hợp tác */ html body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(6) .subject-status-chip, html body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(6) .subject-status-badge, html body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(6) [class*="status"], html body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(6) span { box-sizing: border-box !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; max-width: 100% !important; min-height: 28px !important; padding: 0 12px !important; border-radius: 999px !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; font-size: 11px !important; line-height: 1.15 !important; } /* ---------- B. SUBJECT SEARCH BOX CONTRAST ---------- */ /* Stronger default contrast in normal browsing state. */ html body.atosy-view-subject #subject-full-page.subject-object-native input[type="search"], html body.atosy-view-subject #subject-full-page.subject-object-native input[placeholder*="Mã Chủ thể"], html body.atosy-view-subject #subject-full-page.subject-object-native input[placeholder*="tên"], html body.atosy-view-subject #subject-full-page.subject-object-native input[placeholder*="email"] { border: 1px solid rgba(118, 170, 255, 0.34) !important; border-bottom-color: rgba(173, 212, 255, 0.62) !important; box-shadow: inset 0 -1px 0 rgba(173, 212, 255, 0.34), inset 0 1px 0 rgba(255,255,255,0.05) !important; } /* Preserve a clear focus state as well. */ html body.atosy-view-subject #subject-full-page.subject-object-native input[type="search"]:focus, html body.atosy-view-subject #subject-full-page.subject-object-native input[placeholder*="Mã Chủ thể"]:focus, html body.atosy-view-subject #subject-full-page.subject-object-native input[placeholder*="tên"]:focus, html body.atosy-view-subject #subject-full-page.subject-object-native input[placeholder*="email"]:focus { border-color: rgba(130, 195, 255, 0.72) !important; border-bottom-color: rgba(195, 228, 255, 0.92) !important; box-shadow: 0 0 0 1px rgba(95, 175, 255, 0.18), inset 0 -1px 0 rgba(195, 228, 255, 0.55), inset 0 1px 0 rgba(255,255,255,0.08) !important; } /* 288a END */ /* ========================================================== 288c — STATUS TEXT + SEARCH BORDER FIX Only Subject list status and lookup search. ========================================================== */ /* Allow more usable width in the status column. */ html body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(6) { padding-left: 8px !important; padding-right: 8px !important; } /* Remove the width constraint introduced in 288a. */ html body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(6) > * { max-width: 100% !important; } /* Full numbered labels; do not create ellipsis. */ html body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(6) span { box-sizing: border-box !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; max-width: 100% !important; min-width: 0 !important; padding: 4px 5px !important; font-size: 10px !important; line-height: 1.15 !important; white-space: nowrap !important; overflow: visible !important; text-overflow: clip !important; } /* The exact input found in the 288b DOM audit. */ html body.atosy-view-subject #subject-full-page #subject-full-search-input { border: 1px solid rgba(145, 195, 255, .60) !important; border-bottom: 1px solid rgba(185, 219, 255, .85) !important; box-shadow: inset 0 -1px 0 rgba(185, 219, 255, .28), inset 0 1px 0 rgba(255, 255, 255, .06) !important; } html body.atosy-view-subject #subject-full-page #subject-full-search-input:focus { border-color: rgba(180, 220, 255, .90) !important; box-shadow: 0 0 0 2px rgba(110, 180, 255, .16), inset 0 -1px 0 rgba(200, 230, 255, .32) !important; } /* 288c END */ /* ========================================================== 288e — EXACT CSS CASCADE CORRECTION Scoped only to Subject search and status badges. ========================================================== */ /* Exact lookup input: stronger than the old 0.3 rule. */ html body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup #subject-full-search-input { border: 1px solid rgba(145, 195, 255, .60) !important; border-bottom: 1px solid rgba(185, 219, 255, .85) !important; box-shadow: inset 0 -1px 0 rgba(185, 219, 255, .28), inset 0 1px 0 rgba(255,255,255,.06) !important; } html body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup #subject-full-search-input:focus { border-color: rgba(180, 220, 255, .90) !important; box-shadow: 0 0 0 2px rgba(110, 180, 255, .16), inset 0 -1px 0 rgba(200,230,255,.32) !important; } /* Override the exact .subject-full-status rule from 288a. */ html body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-table tbody td:nth-child(6) > span.subject-full-status { box-sizing: border-box !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: max-content !important; max-width: 100% !important; min-width: 0 !important; padding: 4px 5px !important; font-size: 10px !important; line-height: 1.15 !important; white-space: nowrap !important; overflow: visible !important; text-overflow: clip !important; } /* 288e END */ /* ========================================================== 290a — SUBJECT SEARCH CLEAR BUTTON ========================================================== */ html body.atosy-view-subject #subject-full-page.subject-object-native .subject-full-search { position: relative !important; } html body.atosy-view-subject #subject-full-page.subject-object-native #subject-full-search-input { padding-right: 42px !important; } html body.atosy-view-subject #subject-full-page.subject-object-native #subject-full-search-clear { position: absolute !important; top: 50% !important; right: 9px !important; transform: translateY(-50%) !important; z-index: 2 !important; width: 23px !important; height: 23px !important; min-width: 23px !important; min-height: 23px !important; display: flex !important; align-items: center !important; justify-content: center !important; padding: 0 !important; margin: 0 !important; border: 0 !important; border-radius: 50% !important; background: rgba(139,180,240,.16) !important; color: #c6dfff !important; font-family: Arial,sans-serif !important; font-size: 18px !important; font-weight: 400 !important; line-height: 1 !important; cursor: pointer !important; } html body.atosy-view-subject #subject-full-page.subject-object-native #subject-full-search-clear[hidden] { display: none !important; } html body.atosy-view-subject #subject-full-page.subject-object-native #subject-full-search-clear:hover { background: rgba(139,180,240,.30) !important; color: #fff !important; } html body.atosy-view-subject #subject-full-page.subject-object-native #subject-full-search-clear:focus-visible { outline: 2px solid #a8d7ff !important; outline-offset: 2px !important; } /* 290a END */ /* ========================================================== 291b — SUBJECT ADD BUTTON IN LOOKUP Reuse existing button, shorten search, keep total label. ========================================================== */ html body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup .subject-object-native-lookup-controls { display: grid !important; grid-template-columns: minmax(0, 1fr) 190px 118px !important; align-items: center !important; gap: 8px !important; min-width: 0 !important; } html body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup .subject-object-native-lookup-controls .subject-full-search { width: 100% !important; min-width: 0 !important; max-width: none !important; } html body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup #subject-full-search-input { width: 100% !important; min-width: 0 !important; } html body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup #subject-full-status { width: 190px !important; min-width: 0 !important; max-width: 100% !important; } html body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup #subject-full-add { display: inline-flex !important; align-items: center !important; justify-content: center !important; box-sizing: border-box !important; width: 118px !important; min-width: 0 !important; max-width: 100% !important; height: 36px !important; padding: 0 8px !important; margin: 0 !important; border-radius: 10px !important; background: #216cf0 !important; border: 1px solid rgba(150, 204, 255, .42) !important; color: #fff !important; font-size: 11px !important; font-weight: 700 !important; line-height: 1 !important; white-space: nowrap !important; cursor: pointer !important; } html body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup #subject-full-add:hover { background: #3480ff !important; } html body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup #subject-full-add:focus-visible { outline: 2px solid #b7dbff !important; outline-offset: 2px !important; } /* 291b END */ /* ========================================================== 291i — ADD SUBJECT BUTTON HEIGHT FIX Override old 50px min-height without changing JS. ========================================================== */ html body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup .subject-object-native-lookup-controls #subject-full-add { box-sizing: border-box !important; height: 36px !important; min-height: 36px !important; max-height: 36px !important; padding: 0 8px !important; margin: 0 !important; align-self: center !important; line-height: 1.18 !important; white-space: nowrap !important; } /* 291i END */ /* ========================================================== 291j — NAVY LIQUID ADD SUBJECT BUTTON Align with the status filter. Calm navy liquid styling. ========================================================== */ html body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup .subject-object-native-lookup-controls #subject-full-add { box-sizing: border-box !important; height: 34px !important; min-height: 34px !important; max-height: 34px !important; align-self: center !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 9px !important; margin: 0 !important; border-radius: 9px !important; background: linear-gradient( 180deg, rgba(39, 79, 116, 0.88) 0%, rgba(20, 49, 80, 0.94) 100% ) !important; border: 1px solid rgba( 129, 174, 210, 0.34 ) !important; color: #E2EDFA !important; font-size: 11px !important; font-weight: 600 !important; line-height: 1.18 !important; letter-spacing: 0.01em !important; white-space: nowrap !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.09) !important; text-shadow: none !important; filter: none !important; transform: none !important; transition: background 160ms ease, border-color 160ms ease, color 160ms ease !important; } html body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup .subject-object-native-lookup-controls #subject-full-add:hover { background: linear-gradient( 180deg, rgba(51, 94, 132, 0.94) 0%, rgba(27, 62, 97, 0.98) 100% ) !important; border-color: rgba( 153, 195, 226, 0.52 ) !important; color: #FFFFFF !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12) !important; transform: none !important; } html body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup .subject-object-native-lookup-controls #subject-full-add:active { background: #122B49 !important; box-shadow: none !important; transform: none !important; } html body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup .subject-object-native-lookup-controls #subject-full-add:focus-visible { outline: 2px solid rgba( 161, 206, 240, 0.82 ) !important; outline-offset: 2px !important; } /* 291j END */ /* ========================================================== 293c — SUBJECT CANONICAL LOOKUP FIX Legacy hero/dashboard hidden; lookup is primary UI. ========================================================== */ /* 293d — RESTORE SUBJECT HEADER AND DASHBOARD Do not hide the original Subject header or metrics. */ html body.atosy-view-subject #subject-full-page.subject-object-native #subject-object-native-lookup { margin-top: 0 !important; } /* 293c END */ /* ========================================================== 294f — UNIFIED NAVY BODY / COLORED HEADERS View / Edit / Create — visual styling only. Color belongs to card HEADERS, not card bodies. ========================================================== */ .atosy-subject-detail-v5-overlay { --at294-text: #EFF6FF; --at294-muted: #B8CDE5; --at294-border: rgba(140, 186, 226, .24); --at294-body: linear-gradient( 150deg, #193B5E 0%, #132E4E 54%, #102842 100% ); } /* A unified navy modal background */ .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer { background: linear-gradient( 160deg, #112D4E 0%, #0A213F 100% ) !important; color: var(--at294-text) !important; border-color: rgba(155, 198, 234, .34) !important; box-shadow: 0 14px 35px rgba(1, 12, 30, .22) !important; } /* Preserve original internal scrolling */ .atosy-subject-detail-v5-overlay :is( .atosy-subject-detail-v5-body, .atosy-subject-detail-v5-edit-body ) { background: linear-gradient( 155deg, #102B4B 0%, #0D2442 55%, #0A1F3B 100% ) !important; color: var(--at294-text) !important; } /* Every main information card uses the SAME navy body */ .atosy-subject-detail-v5-overlay :is( .atosy-subject-detail-v5-section, .atosy-subject-detail-v5-edit-section ) { background: var(--at294-body) !important; color: var(--at294-text) !important; border: 1px solid var(--at294-border) !important; box-shadow: inset 0 1px rgba(255,255,255,.055) !important; } /* Accent variables affect only the header strips */ .atosy-subject-detail-v5-overlay :is( .atosy-subject-detail-v5-section, .atosy-subject-detail-v5-edit-section ) { --at294-head: linear-gradient(90deg, #245184, #1B3A63); } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-section.purple { --at294-head: linear-gradient(90deg, #493B7A, #312858); } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-section.cyan { --at294-head: linear-gradient(90deg, #17647C, #14465F); } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-section.green { --at294-head: linear-gradient(90deg, #1D615B, #174540); } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-section.slate { --at294-head: linear-gradient(90deg, #394F76, #263A5C); } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-section.orange { --at294-head: linear-gradient(90deg, #705139, #49382F); } /* Edit/Create cards are ordered consistently. Header colors vary, body backgrounds do not. */ .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-edit-section:nth-of-type(6n+2) { --at294-head: linear-gradient(90deg, #493B7A, #312858); } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-edit-section:nth-of-type(6n+3) { --at294-head: linear-gradient(90deg, #17647C, #14465F); } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-edit-section:nth-of-type(6n+4) { --at294-head: linear-gradient(90deg, #1D615B, #174540); } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-edit-section:nth-of-type(6n+5) { --at294-head: linear-gradient(90deg, #27577A, #1C3D5B); } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-edit-section:nth-of-type(6n) { --at294-head: linear-gradient(90deg, #3D4878, #273458); } /* View header strips */ .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-section > .atosy-subject-detail-v5-section-head { background: var(--at294-head) !important; color: #F5F9FF !important; border-bottom: 1px solid rgba(171,208,239,.21) !important; } /* Edit/Create header strip is the section's first child. Restrict styling to the heading block, not its form fields. */ .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-edit-section > :first-child:not(input):not(select):not(textarea) { background: var(--at294-head) !important; color: #F5F9FF !important; } /* Color headings and their nested text consistently */ .atosy-subject-detail-v5-overlay :is( .atosy-subject-detail-v5-section-head, .atosy-subject-detail-v5-edit-section > :first-child ) :is( .atosy-subject-detail-v5-section-title, h2, h3, h4, strong, small, span ) { color: #F0F6FF !important; } /* Labels and values in navy body */ .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-field-label { color: #ACC5E0 !important; } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-field-value { color: #F2F7FF !important; } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-section-title { color: #F2F7FF !important; } /* Three summary chips: quiet common navy, readable text */ .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-summary-card { background: linear-gradient( 150deg, #204367, #163253 ) !important; color: #EDF5FF !important; border: 1px solid rgba(145,190,229,.28) !important; box-shadow: inset 0 1px rgba(255,255,255,.06) !important; } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-summary-card * { color: #E7F1FF !important; } /* Inputs stay dark navy; existing dimensions remain intact */ .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer :is(input, select, textarea):not(:disabled) { background-color: #1B3A5B !important; color: #F0F6FF !important; border-color: rgba(150,190,228,.35) !important; box-shadow: inset 0 1px rgba(255,255,255,.045) !important; caret-color: #E3F3FF !important; } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer :is(input, textarea)::placeholder { color: #B1C8DF !important; opacity: 1 !important; } /* Disabled fields: different tone, still readable */ .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer :is(input, select, textarea):disabled { background: #223C59 !important; color: #B9CADE !important; border-color: rgba(139,178,215,.23) !important; opacity: .85 !important; } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer :is(input, select, textarea):focus-visible { border-color: #8BBDDF !important; outline: 1px solid rgba(143,196,230,.75) !important; outline-offset: 1px !important; box-shadow: 0 0 0 3px rgba(102,161,205,.12) !important; } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer select option { background: #143150; color: #F1F7FF; } /* Form labels: light, not navy-on-navy */ .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-edit-section label { color: #BFD3E9 !important; } /* Sub-panels follow the same navy body gradient */ .atosy-subject-detail-v5-overlay .atosy-communication-group-v1, .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-technical { background: var(--at294-body) !important; color: #F0F6FF !important; border-color: var(--at294-border) !important; box-shadow: inset 0 1px rgba(255,255,255,.05) !important; } /* Notices: quiet navy; preserve meaning and text */ .atosy-subject-detail-v5-overlay :is( .atosy-subject-detail-v5-edit-message, .atosy-subject-class-enum-note, .atosy-address-enum-v1-note ) { background: #1C3B5B !important; color: #C9E0F5 !important; border-color: rgba(148,191,226,.28) !important; } /* Leave layout, scrollbar, element visibility, event handlers and save logic untouched. */ /* 294f END */ /* ========================================================== 294g — REFINED MIDNIGHT NAVY LIQUID Only visual properties inside Subject View/Edit/Create. ========================================================== */ .atosy-subject-detail-v5-overlay { --at294g-glass: linear-gradient( 145deg, rgba(27, 61, 94, .96) 0%, rgba(17, 43, 72, .98) 55%, rgba(12, 33, 58, .99) 100% ); --at294g-edge: rgba(148, 191, 229, .26); } /* Main hero: move away from bright royal blue */ .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-hero { background: radial-gradient( ellipse at 94% 4%, rgba(127, 177, 216, .19), transparent 48% ), radial-gradient( ellipse at 8% 94%, rgba(32, 89, 146, .34), transparent 55% ), linear-gradient( 118deg, #081F40 0%, #10345C 52%, #17436B 100% ) !important; border-bottom: 1px solid rgba(145, 190, 231, .29) !important; box-shadow: inset 0 1px 0 rgba(235, 247, 255, .13), inset 0 -1px 0 rgba(5, 20, 39, .22) !important; } /* The main modal canvas gains a gentle light reflection */ .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer { background: radial-gradient( ellipse at 78% 0%, rgba(85, 139, 188, .13), transparent 52% ), linear-gradient( 160deg, #102D4F, #091E37 ) !important; border-color: rgba(136, 186, 228, .32) !important; box-shadow: 0 14px 36px rgba(1, 10, 27, .27), inset 0 1px 0 rgba(235, 247, 255, .10) !important; } /* Both reading and editing surfaces */ .atosy-subject-detail-v5-overlay :is( .atosy-subject-detail-v5-body, .atosy-subject-detail-v5-edit-body ) { background: radial-gradient( ellipse at 0% 8%, rgba(61, 110, 161, .12), transparent 46% ), linear-gradient( 160deg, #102C4A, #0B213C 75%, #0A1E36 ) !important; } /* Shared navy card body, same across all accent types */ .atosy-subject-detail-v5-overlay :is( .atosy-subject-detail-v5-section, .atosy-subject-detail-v5-edit-section ) { background: var(--at294g-glass) !important; border-color: var(--at294g-edge) !important; box-shadow: inset 0 1px 0 rgba(242, 249, 255, .09), 0 3px 10px rgba(0, 12, 28, .08) !important; } /* Subtle inner highlight in colored header strips */ .atosy-subject-detail-v5-overlay :is( .atosy-subject-detail-v5-section-head, .atosy-subject-detail-v5-edit-section-head ) { background: var(--at294-head) !important; color: #F3F8FF !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.13), inset 0 -1px 0 rgba(4,20,40,.17) !important; } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-section-title, .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-edit-section-head :is(h2, h3, h4, strong, span) { color: #F2F7FF !important; } /* Give the three small summary cards legible text */ .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-summary-card { background: linear-gradient( 145deg, #204464, #142F50 ) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important; } .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-summary-card * { color: #EAF4FF !important; } /* Higher specificity for classification selects: some older rules replace both background and text with pale colors. */ html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer select.atosy-subject-class-enum:not(:disabled), html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer select.atosy-subject-create-select:not(:disabled) { background-color: #1A3A5A !important; color: #ECF5FF !important; border-color: rgba(146, 194, 234, .38) !important; -webkit-text-fill-color: #ECF5FF !important; } html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer :is(input, select, textarea):disabled { background-color: #263F5A !important; color: #B8CCE1 !important; -webkit-text-fill-color: #B8CCE1 !important; border-color: rgba(139, 175, 206, .25) !important; opacity: .85 !important; } html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer :is(input, select, textarea):not(:disabled) { color: #EEF6FF !important; -webkit-text-fill-color: #EEF6FF !important; } html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer :is(input, select, textarea):focus-visible { border-color: rgba(172, 217, 247, .80) !important; box-shadow: 0 0 0 3px rgba(89, 151, 198, .15), inset 0 1px 0 rgba(255,255,255,.09) !important; } /* Harmonize messaging and supplementary classification notes */ .atosy-subject-detail-v5-overlay :is( .atosy-subject-detail-v5-edit-message, .atosy-subject-class-enum-note, .atosy-address-enum-v1-note ) { background: linear-gradient( 140deg, #244765, #193653 ) !important; color: #D8E8F8 !important; border-color: rgba(144, 190, 225, .26) !important; } /* Phone, address and communication sub-cards: keep card surfaces navy without recoloring the parent header. */ .atosy-subject-detail-v5-overlay .atosy-communication-group-v1 :is( [class*="card"], [class*="panel"], [class*="item"], [class*="entry"] ) { background: linear-gradient( 145deg, #1D4262, #143451 ) !important; color: #EDF6FF !important; border-color: rgba(148, 193, 230, .25) !important; } .atosy-subject-detail-v5-overlay .atosy-communication-group-v1 :is( [class*="card"], [class*="panel"], [class*="item"], [class*="entry"] ) :is(label, strong, span, small, p) { color: #DCECFB !important; } /* Preserve native scrolling, field layouts and save actions. */ /* 294g END */ /* ========================================================== 294i — PREMIUM NAVY GLASS CONTACT CARDS Exact selectors confirmed by DOM audit 294h. Preserve layout, internal scroll and form interactions. ========================================================== */ /* VIEW: Address / Phone contact cards */ html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-section.green .atosy-profile-contact-card-v1 { background: radial-gradient( ellipse at 88% 0%, rgba(116, 209, 215, .14) 0%, transparent 55% ), linear-gradient( 145deg, #1B435F 0%, #143652 52%, #102C46 100% ) !important; border: 1px solid rgba(124, 207, 203, .33) !important; box-shadow: inset 0 1px 0 rgba(235, 255, 255, .18), inset 0 -1px 0 rgba(5, 25, 42, .35), 0 5px 14px rgba(2, 15, 31, .12) !important; color: #EEF8FF !important; } /* Contact mini-header text */ html body .atosy-subject-detail-v5-overlay .atosy-profile-contact-card-v1-head { color: #E8F8FF !important; background: transparent !important; } html body .atosy-subject-detail-v5-overlay .atosy-profile-contact-card-v1-head :is(strong, span, small, p) { color: #E5F5FF !important; } /* Details and values: no dark-on-dark text */ html body .atosy-subject-detail-v5-overlay .atosy-profile-contact-card-v1 .atosy-subject-detail-v5-field-label { color: #B7D8DF !important; } html body .atosy-subject-detail-v5-overlay .atosy-profile-contact-card-v1 .atosy-subject-detail-v5-field-value { color: #F3FAFF !important; -webkit-text-fill-color: #F3FAFF !important; } html body .atosy-subject-detail-v5-overlay .atosy-profile-contact-card-v1 .atosy-subject-detail-v5-field-value :is(span, strong, div, p) { color: #F3FAFF !important; -webkit-text-fill-color: #F3FAFF !important; } /* Preserve links as clearly recognizable clickable text */ html body .atosy-subject-detail-v5-overlay .atosy-profile-contact-card-v1 a { color: #A6E7FA !important; -webkit-text-fill-color: #A6E7FA !important; text-decoration-color: rgba(166,231,250,.50) !important; } /* Premium liquid sheen for main cards. Existing color-coded section HEADERS remain unchanged. */ html body .atosy-subject-detail-v5-overlay :is( .atosy-subject-detail-v5-section, .atosy-subject-detail-v5-edit-section ) { box-shadow: inset 0 1px 0 rgba(239, 250, 255, .15), inset 1px 0 0 rgba(200, 234, 255, .035), 0 5px 16px rgba(2, 13, 30, .14) !important; border-color: rgba(147, 194, 230, .30) !important; } /* Refined liquid highlight for each colored title */ html body .atosy-subject-detail-v5-overlay :is( .atosy-subject-detail-v5-section-head, .atosy-subject-detail-v5-edit-section-head ) { box-shadow: inset 0 1px 0 rgba(246, 253, 255, .20), inset 0 -1px 0 rgba(3, 18, 36, .23) !important; } /* EDIT / CREATE: communication groups get the same finish */ html body .atosy-subject-detail-v5-overlay .atosy-communication-group-v1 { background: radial-gradient( ellipse at 90% 0%, rgba(102, 190, 203, .12), transparent 55% ), linear-gradient( 145deg, #1A3E5D, #112E4B ) !important; border-color: rgba(130, 195, 219, .30) !important; box-shadow: inset 0 1px 0 rgba(241, 251, 255, .13), 0 4px 13px rgba(1, 14, 31, .11) !important; } /* Add-custom-field buttons, previously pale white */ html body .atosy-subject-detail-v5-overlay button.atosy-subject-custom-add-v1, html body .atosy-subject-detail-v5-overlay .atosy-subject-custom-add-v1 { background: linear-gradient( 150deg, #234A6C, #173552 ) !important; border-color: rgba(144, 201, 234, .38) !important; color: #E7F5FF !important; -webkit-text-fill-color: #E7F5FF !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.13) !important; } html body .atosy-subject-detail-v5-overlay .atosy-subject-custom-add-v1:hover { background: linear-gradient( 150deg, #2B577C, #1B3F61 ) !important; border-color: rgba(164, 217, 241, .55) !important; } /* 294i END */ /* ========================================================== 294k — ADDRESS ENUM PREMIUM NAVY GLASS Exact Edit address classes from DOM audit 294j. No structural changes or event handler changes. ========================================================== */ /* Address master panel - remove pale gradient */ html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-edit-section .atosy-address-enum-v1 { background: radial-gradient( ellipse at 90% 0%, rgba(114, 196, 207, .15), transparent 58% ), linear-gradient( 150deg, #1C4560 0%, #153853 54%, #102D49 100% ) !important; color: #ECF7FF !important; border: 1px solid rgba(137, 201, 216, .36) !important; box-shadow: inset 0 1px 0 rgba(243, 253, 255, .18), inset 0 -1px 0 rgba(3, 24, 40, .26), 0 7px 19px rgba(1, 15, 31, .13) !important; } /* A deep emerald header, not an independent white block */ html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1-head { background: linear-gradient( 100deg, #1D615E, #16475A 60%, #153D54 ) !important; color: #F0FAFF !important; border-bottom: 1px solid rgba(166, 220, 225, .26) !important; box-shadow: inset 0 1px rgba(255,255,255,.17) !important; } html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1-title, html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1-head :is(strong, span, small, label) { color: #EDF8FF !important; } /* All address labels must remain readable */ html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1-field label { color: #C2DBEC !important; } html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1 :is(input, select, textarea):not(:disabled) { background-color: #193C5B !important; color: #F1F9FF !important; -webkit-text-fill-color: #F1F9FF !important; border-color: rgba(146,198,230,.39) !important; } html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1 :is(input, select, textarea):disabled { background-color: #263F58 !important; color: #B7CBDC !important; -webkit-text-fill-color: #B7CBDC !important; border-color: rgba(150,179,205,.23) !important; } /* Preserve amber meaning for legacy ward alerts, but remove the harsh pale-yellow surface. */ html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1-old-ward.show { background: linear-gradient( 130deg, #59482C, #453A2D ) !important; color: #FFE5AF !important; -webkit-text-fill-color: #FFE5AF !important; border: 1px solid rgba(232, 191, 110, .39) !important; box-shadow: inset 0 1px rgba(255,239,194,.10) !important; } /* Address notes use the same glass language */ html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1-note { background: linear-gradient( 145deg, #24465F, #193A54 ) !important; color: #DCECF8 !important; border-color: rgba(143,191,222,.29) !important; box-shadow: inset 0 1px rgba(255,255,255,.09) !important; } /* Preserve grid, content height, overflow and all dependent enum interaction behaviors. */ /* 294k END */ /* ========================================================== 294m — SUBJECT EDIT LIQUID UI REFINEMENT Precise Subject Edit / Create styling. No changes to form layout, logic or scrolling. ========================================================== */ /* 1. Address: rounded inset liquid card */ html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1 { border-radius: 20px !important; overflow: visible; } html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1-head { border-radius: 12px !important; background: linear-gradient( 105deg, #205F64, #194B60 65%, #183E55 ) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.20), 0 3px 8px rgba(0,16,31,.12) !important; } html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1-title { color: #F3FAFF !important; -webkit-text-fill-color: #F3FAFF !important; } /* 2. Edit communication subpanels */ html body .atosy-subject-detail-v5-overlay .atosy-communication-group-v1 { border-radius: 18px !important; color: #F0F7FF !important; } html body .atosy-subject-detail-v5-overlay .atosy-communication-group-v1-head { background: linear-gradient( 100deg, rgba(58,111,147,.30), rgba(20,60,92,.19) ) !important; border-radius: 12px !important; box-shadow: inset 0 1px 0 rgba(238,250,255,.13) !important; } html body .atosy-subject-detail-v5-overlay .atosy-communication-group-v1-title, html body .atosy-subject-detail-v5-overlay .atosy-communication-group-v1-heading, html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2-heading { color: #F1F8FF !important; -webkit-text-fill-color: #F1F8FF !important; } html body .atosy-subject-detail-v5-overlay .atosy-communication-group-v1-head :is(h2,h3,h4,strong,span,p,small), html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2-head :is(h2,h3,h4,strong,span,p,small) { color: #DCEBFA !important; -webkit-text-fill-color: #DCEBFA !important; } /* 3. Website: exact class identified in Edit audit */ html body .atosy-subject-detail-v5-overlay .atosy-communication-group-v1-platform .atosy-platform-website-v1 { background: linear-gradient( 145deg, #214563 0%, #173957 55%, #12304E 100% ) !important; color: #EAF5FF !important; border: 1px solid rgba(142,195,232,.32) !important; border-radius: 14px !important; box-shadow: inset 0 1px 0 rgba(247,252,255,.15), 0 3px 9px rgba(0,17,35,.08) !important; } /* Website row may have a separate form-field wrapper */ html body .atosy-subject-detail-v5-overlay .atosy-communication-group-v1-platform .atosy-subject-detail-v5-edit-field:has( .atosy-platform-website-v1 ) { background: linear-gradient(145deg,#214563,#143451) !important; color: #EAF5FF !important; border-radius: 14px !important; border-color: rgba(142,195,232,.28) !important; } /* Website label, independent of its inner wrapper */ html body .atosy-subject-detail-v5-overlay .atosy-communication-group-v1-platform .atosy-subject-detail-v5-edit-field:has( .atosy-platform-website-v1 ) label, html body .atosy-subject-detail-v5-overlay .atosy-platform-website-v1 label { color: #BCD9EF !important; -webkit-text-fill-color: #BCD9EF !important; } /* 4. Consistent inner contact cards */ html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 { background: linear-gradient( 145deg,#204363,#153650 ) !important; border: 1px solid rgba(146,196,229,.27) !important; border-radius: 14px !important; color: #EEF7FF !important; box-shadow: inset 0 1px 0 rgba(250,253,255,.13), 0 3px 10px rgba(2,15,30,.08) !important; } html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2-head { background: transparent !important; color: #EAF6FF !important; } html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2-fields { background: transparent !important; color: #EAF5FF !important; } /* Labels in address and communication sections */ html body .atosy-subject-detail-v5-overlay :is( .atosy-address-enum-v1, .atosy-communication-group-v1, .atosy-contact-card-v2 ) :is( .atosy-subject-detail-v5-edit-field, .atosy-address-enum-v1-field ) label { color: #C5D9ED !important; -webkit-text-fill-color: #C5D9ED !important; } /* Editable values remain bright; disabled remain distinct */ html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-edit-section :is(input,select,textarea):not(:disabled) { color: #F0F8FF !important; -webkit-text-fill-color: #F0F8FF !important; } html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-edit-section :is(input,select,textarea):disabled { color: #B7C9DD !important; -webkit-text-fill-color: #B7C9DD !important; } /* Subtle future-liquid edges on nested forms */ html body .atosy-subject-detail-v5-overlay :is( .atosy-address-enum-v1, .atosy-communication-group-v1, .atosy-contact-card-v2 ) { box-shadow: inset 0 1px 0 rgba(240,252,255,.17), inset 0 -1px 0 rgba(4,20,39,.13), 0 5px 14px rgba(2,14,30,.10) !important; } /* 294m END */ /* ========================================================== 294n — REMOVE NESTED SUBCARD HEADER FRAMES One rounded exterior card; no framed inner heading. ========================================================== */ /* Address heading: no duplicate box or inset border */ html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1 > .atosy-address-enum-v1-head { background: transparent !important; background-image: none !important; border: 0 !important; border-radius: 0 !important; outline: 0 !important; box-shadow: none !important; } /* Direct contact and platform headings */ html body .atosy-subject-detail-v5-overlay .atosy-communication-group-v1 > .atosy-communication-group-v1-head { background: transparent !important; background-image: none !important; border: 0 !important; border-radius: 0 !important; outline: 0 !important; box-shadow: none !important; } /* Remove pseudo-element frames only on these headings */ html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1 > .atosy-address-enum-v1-head::before, html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1 > .atosy-address-enum-v1-head::after, html body .atosy-subject-detail-v5-overlay .atosy-communication-group-v1 > .atosy-communication-group-v1-head::before, html body .atosy-subject-detail-v5-overlay .atosy-communication-group-v1 > .atosy-communication-group-v1-head::after { content: none !important; border: 0 !important; box-shadow: none !important; } /* Keep one polished exterior frame per subcard */ html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1, html body .atosy-subject-detail-v5-overlay .atosy-communication-group-v1 { border-radius: 18px !important; border: 1px solid rgba(141,192,225,.31) !important; box-shadow: inset 0 1px 0 rgba(240,252,255,.16), 0 5px 14px rgba(2,14,30,.10) !important; } /* Preserve the label / subtitle contrast */ html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1-title, html body .atosy-subject-detail-v5-overlay .atosy-communication-group-v1-title { color: #F1F8FF !important; -webkit-text-fill-color: #F1F8FF !important; } /* No structural or scrolling changes. */ /* 294n END */ /* ========================================================== 294o — REMOVE CONTACT HEADING INNER FRAMES Email / Phone headings: clean text without inner boxes. ========================================================== */ /* Remove the rectangular background hugging heading text */ html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 .atosy-contact-card-v2-heading { background: transparent !important; background-image: none !important; background-color: transparent !important; border: 0 !important; border-radius: 0 !important; outline: 0 !important; box-shadow: none !important; color: #F1F8FF !important; -webkit-text-fill-color: #F1F8FF !important; } /* Preserve clean header text and description */ html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2-head { background: transparent !important; background-image: none !important; border: 0 !important; box-shadow: none !important; } html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2-head :is(strong, span, small, p) { background: transparent !important; background-image: none !important; color: #D8E9F8 !important; } /* Only one Liquid exterior frame per Email/Phone card */ html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 { border-radius: 14px !important; border: 1px solid rgba(148, 193, 230, .27) !important; box-shadow: inset 0 1px 0 rgba(240, 252, 255, .14), 0 3px 10px rgba(2, 15, 30, .08) !important; } /* No changes to input, + button, layout or scroll. */ /* 294o END */ /* ========================================================== 295b — UNIFIED ATOSY SAPPHIRE NAVY LIQUID Colors derived from Object Category Manager audit 295a. Presentation only; preserve layouts and interactions. ========================================================== */ html body .atosy-subject-detail-v5-overlay { --at295-surface: linear-gradient( 145deg, rgba(10,52,108,.97), rgba(5,27,66,.98) ); --at295-card: linear-gradient( 150deg, #0C3267 0%, #092B59 56%, #071F46 100% ); --at295-input: rgba(5,34,77,.90); --at295-edge: rgba(154,201,255,.30); --at295-text: #F7FBFF; --at295-muted: #BED4EF; } /* Main Subject modal — same Sapphire Navy family */ html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer { background: var(--at295-surface) !important; color: var(--at295-text) !important; border-color: rgba(255,255,255,.14) !important; box-shadow: 0 22px 65px rgba(0,0,0,.31), inset 0 1px 0 rgba(255,255,255,.09) !important; } /* Main header — deep navy instead of blue-grey */ html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-hero { background: radial-gradient( ellipse at 92% 0%, rgba(116,166,229,.16), transparent 52% ), linear-gradient( 115deg, #061C43 0%, #0A326C 62%, #10427A 100% ) !important; border-bottom: 1px solid rgba(154,201,255,.20) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.12) !important; } /* The existing rounded decorative corner follows navy */ html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-hero::before, html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-hero::after { background-color: rgba(139,184,239,.09); } /* Same dark palette for View / Edit / Create bodies */ html body .atosy-subject-detail-v5-overlay :is( .atosy-subject-detail-v5-body, .atosy-subject-detail-v5-edit-body ) { background: radial-gradient( ellipse at 7% 2%, rgba(56,115,195,.10), transparent 50% ), linear-gradient( 160deg, #092C61 0%, #071F49 70%, #061B40 100% ) !important; color: var(--at295-text) !important; } /* Uniform card bodies. Colored headers are left intact. */ html body .atosy-subject-detail-v5-overlay :is( .atosy-subject-detail-v5-section, .atosy-subject-detail-v5-edit-section ) { background: var(--at295-card) !important; border-color: rgba(154,201,255,.22) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.11), 0 5px 15px rgba(0,10,34,.12) !important; } /* The three View summary tiles */ html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-summary-card { background: linear-gradient( 145deg,#103A76,#092958 ) !important; border-color: var(--at295-edge) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important; } /* All nested form surfaces share the same color family */ html body .atosy-subject-detail-v5-overlay :is( .atosy-address-enum-v1, .atosy-communication-group-v1, .atosy-contact-card-v2, .atosy-profile-contact-card-v1 ) { background: var(--at295-card) !important; border-color: var(--at295-edge) !important; color: var(--at295-text) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 5px 15px rgba(0,10,34,.11) !important; } /* Website nested block */ html body .atosy-subject-detail-v5-overlay .atosy-platform-website-v1 { background: linear-gradient( 145deg,#103B73,#092958 ) !important; border-color: var(--at295-edge) !important; color: var(--at295-text) !important; } /* Exact reference palette for editable fields */ html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer :is(input,select,textarea):not(:disabled) { background-color: var(--at295-input) !important; color: #FFFFFF !important; -webkit-text-fill-color: #FFFFFF !important; border-color: var(--at295-edge) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px rgba(0,0,0,.08) !important; } html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer :is(input,select,textarea):disabled { background-color: #102B54 !important; color: #B9CEE6 !important; -webkit-text-fill-color: #B9CEE6 !important; border-color: rgba(154,201,255,.18) !important; } /* Clear labels throughout nested forms */ html body .atosy-subject-detail-v5-overlay :is( .atosy-subject-detail-v5-edit-field, .atosy-address-enum-v1-field, .atosy-communication-group-v1, .atosy-contact-card-v2 ) label { color: var(--at295-muted) !important; -webkit-text-fill-color: var(--at295-muted) !important; } /* Nested titles, no extra rectangular frames */ html body .atosy-subject-detail-v5-overlay :is( .atosy-address-enum-v1-title, .atosy-communication-group-v1-title, .atosy-contact-card-v2-heading ) { color: var(--at295-text) !important; -webkit-text-fill-color: var(--at295-text) !important; } /* Keep old-ward warning amber and informative */ html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1-old-ward.show { background: linear-gradient( 130deg,#52432F,#3A3240 ) !important; color: #FFE1A6 !important; -webkit-text-fill-color: #FFE1A6 !important; } /* Preserve existing category-header accent colors, margins, corner radii, scroll and input behavior. */ /* 295b END */ /* ========================================================== 295c — UNIFIED SAPPHIRE NAVY COMPONENT PALETTE Canonical color system from Object Category Manager. Scoped to Subject View / Edit / Create. Do not change layout, input logic or scrolling. ========================================================== */ /* 1. Canonical palette */ html body .atosy-subject-detail-v5-overlay { --s295-bg: #051B42; --s295-glass: linear-gradient( 145deg, #0C3267 0%, #092B59 56%, #071F46 100% ); --s295-subglass: linear-gradient( 145deg, #12376D 0%, #0C2D5D 58%, #08234C 100% ); --s295-control: rgba(5,34,77,.90); --s295-border: rgba(154,201,255,.30); --s295-strong: #F7FBFF; --s295-muted: #BDD3EF; } /* 2. All normal card bodies share ONE Navy gradient */ html body .atosy-subject-detail-v5-overlay :is( .atosy-subject-detail-v5-section, .atosy-subject-detail-v5-edit-section ) { background: var(--s295-glass) !important; border-color: rgba(154,201,255,.23) !important; color: var(--s295-strong) !important; } /* 3. Address panel — specifically outrank old 294k */ html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-edit-section .atosy-address-enum-v1 { background: var(--s295-subglass) !important; border-color: var(--s295-border) !important; color: var(--s295-strong) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.11), 0 5px 15px rgba(0,10,34,.11) !important; } /* 4. Communication containers — no old teal body */ html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-edit-section .atosy-communication-group-v1 { background: var(--s295-glass) !important; border-color: var(--s295-border) !important; color: var(--s295-strong) !important; } /* 5. Email / Phone / Website miniature cards */ html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-edit-section :is( .atosy-contact-card-v2, .atosy-platform-website-v1 ) { background: var(--s295-subglass) !important; border-color: var(--s295-border) !important; color: var(--s295-strong) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 3px 11px rgba(0,10,34,.09) !important; } /* View address / phone information cards */ html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-section.green .atosy-profile-contact-card-v1 { background: var(--s295-subglass) !important; border-color: var(--s295-border) !important; color: var(--s295-strong) !important; } /* 6. Inputs and selections — preserve select arrow images */ html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer :is(input, select, textarea):not(:disabled) { background-color: var(--s295-control) !important; color: #FFFFFF !important; -webkit-text-fill-color: #FFFFFF !important; border-color: var(--s295-border) !important; } /* Address has older high-specificity CSS */ html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-edit-section .atosy-address-enum-v1 :is(input,select,textarea):not(:disabled) { background-color: var(--s295-control) !important; color: #FFFFFF !important; -webkit-text-fill-color: #FFFFFF !important; border-color: var(--s295-border) !important; } html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer :is(input,select,textarea):disabled { background-color: #102B54 !important; color: #B9CEE6 !important; -webkit-text-fill-color: #B9CEE6 !important; border-color: rgba(154,201,255,.18) !important; } /* 7. Field labels and readable descriptions */ html body .atosy-subject-detail-v5-overlay :is( .atosy-address-enum-v1, .atosy-communication-group-v1, .atosy-contact-card-v2, .atosy-platform-website-v1 ) label { color: var(--s295-muted) !important; -webkit-text-fill-color: var(--s295-muted) !important; } html body .atosy-subject-detail-v5-overlay :is( .atosy-address-enum-v1-title, .atosy-communication-group-v1-title, .atosy-contact-card-v2-heading ) { color: var(--s295-strong) !important; -webkit-text-fill-color: var(--s295-strong) !important; } /* 8. Address note and dependent classification note */ html body .atosy-subject-detail-v5-overlay :is( .atosy-address-enum-v1-note, .atosy-subject-class-enum-note, .atosy-address-enum-v1-badge ) { background-color: rgba(12,46,96,.93) !important; color: #D8E9FF !important; border-color: rgba(154,201,255,.26) !important; } /* 9. Keep warning amber but avoid light backgrounds */ html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1-old-ward.show { background: linear-gradient( 130deg,#52432F,#3A3240 ) !important; color: #FFE1A6 !important; -webkit-text-fill-color: #FFE1A6 !important; } /* 10. Restore transparency of unframed miniature headings */ html body .atosy-subject-detail-v5-overlay :is( .atosy-address-enum-v1-head, .atosy-communication-group-v1-head, .atosy-contact-card-v2-head, .atosy-contact-card-v2-heading ) { border-color: transparent !important; } /* No changes to border radius, dimensions, form behavior, scrolling, navigation or save operations. */ /* 295c END */ /* ========================================================== 295d — SUBJECT INNER COMPONENT COLOR PARITY Sapphire Navy palette from Object Category Manager. Scope: Subject View / Edit / Create. ========================================================== */ /* ------------------------------------------ A. Unified palette ------------------------------------------ */ html body .atosy-subject-detail-v5-overlay { --s295d-field: rgba(5,34,77,.90); --s295d-surface: linear-gradient( 145deg, #12376D 0%, #0C2D5D 58%, #08234C 100% ); --s295d-note: linear-gradient( 145deg, #10366A, #092856 ); --s295d-border: rgba(154,201,255,.30); --s295d-text: #F7FBFF; --s295d-muted: #BDD3EF; } /* ------------------------------------------ B. Classification Cấp 1–7 ------------------------------------------ */ html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer select.atosy-subject-class-enum:not(:disabled), html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer select.atosy-subject-create-select:not(:disabled) { background-color: var(--s295d-field) !important; color: var(--s295d-text) !important; -webkit-text-fill-color: var(--s295d-text) !important; border: 1px solid var(--s295d-border) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important; } html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer select.atosy-subject-class-enum:disabled, html body .atosy-subject-detail-v5-overlay .atosy-subject-detail-v5-drawer select.atosy-subject-create-select:disabled { background-color: #102B54 !important; color: #B9CEE6 !important; -webkit-text-fill-color: #B9CEE6 !important; border: 1px solid rgba(154,201,255,.18) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important; opacity: 1 !important; } /* Keep native select arrow styling and user interaction. */ /* ------------------------------------------ C. Notes and explanatory boxes ------------------------------------------ */ html body .atosy-subject-detail-v5-overlay :is( .atosy-subject-class-enum-note, .atosy-address-enum-v1-note, .atosy-subject-detail-v5-edit-message ) { background: var(--s295d-note) !important; border: 1px solid rgba(154,201,255,.24) !important; color: #D9E9FB !important; -webkit-text-fill-color: #D9E9FB !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.09) !important; } html body .atosy-subject-detail-v5-overlay :is( .atosy-subject-class-enum-note, .atosy-address-enum-v1-note, .atosy-subject-detail-v5-edit-message ) :is(span,strong,small,p) { color: #D9E9FB !important; -webkit-text-fill-color: #D9E9FB !important; } /* ------------------------------------------ D. Add-field buttons ------------------------------------------ */ html body .atosy-subject-detail-v5-overlay button.atosy-subject-custom-add-v1, html body .atosy-subject-detail-v5-overlay .atosy-subject-custom-add-v1 { background: linear-gradient( 145deg, #123A75, #092856 ) !important; border: 1px dashed rgba(154,201,255,.40) !important; color: #EAF4FF !important; -webkit-text-fill-color: #EAF4FF !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.13) !important; } html body .atosy-subject-detail-v5-overlay .atosy-subject-custom-add-v1:hover { background: linear-gradient( 145deg, #164A8B, #0D3269 ) !important; border-color: rgba(178,219,255,.65) !important; } /* ------------------------------------------ E. Email and Phone inner sections ------------------------------------------ */ html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 .atosy-contact-card-v2-head, html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 .atosy-contact-card-v2-heading { background: transparent !important; background-image: none !important; background-color: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; color: var(--s295d-text) !important; } html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 .atosy-contact-card-v2-fields { background: transparent !important; background-image: none !important; background-color: transparent !important; border-color: transparent !important; color: var(--s295d-text) !important; } html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 .atosy-contact-card-v2-base, html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 .atosy-subject-detail-v5-edit-field { background: transparent !important; background-image: none !important; color: var(--s295d-text) !important; } html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 .atosy-contact-card-v2-head :is(span,strong,small,p) { background: transparent !important; background-image: none !important; color: #D8E9FB !important; -webkit-text-fill-color: #D8E9FB !important; } /* Retain the single outer border from 294o */ html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 { background: var(--s295d-surface) !important; border-color: var(--s295d-border) !important; } /* ------------------------------------------ F. Small Website / classification labels ------------------------------------------ */ html body .atosy-subject-detail-v5-overlay :is( .atosy-platform-website-v1, .atosy-address-enum-v1, .atosy-communication-group-v1 ) :is(label,small) { color: var(--s295d-muted) !important; -webkit-text-fill-color: var(--s295d-muted) !important; } /* Preserve warning semantic color, not white */ html body .atosy-subject-detail-v5-overlay .atosy-address-enum-v1-old-ward.show { background: linear-gradient( 130deg, #52432F, #3A3240 ) !important; color: #FFE1A6 !important; -webkit-text-fill-color: #FFE1A6 !important; } /* 295d END */ /* ========================================================== 295e — CONTACT FIELD SAPPHIRE NAVY CLEANUP Remove legacy inner field strips and recolor add buttons. Scoped exclusively to Subject contact Email / Phone cards. ========================================================== */ /* Inner field wrappers should not create colored bands */ html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 .atosy-contact-card-v2-fields, html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 .atosy-subject-detail-v5-edit-field, html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 .atosy-contact-card-v2-base { background: transparent !important; background-image: none !important; background-color: transparent !important; box-shadow: none !important; } /* Plain text labels and their immediate wrappers */ html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 .atosy-subject-detail-v5-edit-field :is(label, small, span) { background: transparent !important; background-image: none !important; box-shadow: none !important; color: #C6DAF1 !important; -webkit-text-fill-color: #C6DAF1 !important; } /* Keep input controls distinct and in the reference palette */ html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 :is(input, select, textarea):not(:disabled) { background: rgba(5,34,77,.90) !important; color: #F7FBFF !important; -webkit-text-fill-color: #F7FBFF !important; border: 1px solid rgba(154,201,255,.30) !important; border-radius: 11px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important; } /* Email and Phone add buttons: sapphire, not emerald */ html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 .atosy-contact-card-v2-add { background: linear-gradient( 145deg, #16457D, #0B2B5B ) !important; color: #D9EBFF !important; -webkit-text-fill-color: #D9EBFF !important; border: 1px solid rgba(154,201,255,.34) !important; border-radius: 9px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.12) !important; } html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 .atosy-contact-card-v2-add:hover { background: linear-gradient( 145deg, #1D5598, #10366F ) !important; border-color: rgba(185,222,255,.58) !important; } html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 .atosy-contact-card-v2-add:focus-visible { outline: 2px solid rgba(185,222,255,.75) !important; outline-offset: 2px !important; } /* One Sapphire Liquid surface for each contact card */ html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 { background: linear-gradient( 145deg, #12376D, #0C2D5D 58%, #08234C ) !important; border-color: rgba(154,201,255,.30) !important; } /* 295e END */ /* ========================================================== 295g — CONTACT CARD UNIFORM NAVY SURFACE Remove visual color bands without changing field logic. ========================================================== */ /* One solid Sapphire Navy body instead of a color-shifting gradient on Email and Phone cards. */ html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2:is( .atosy-contact-card-v2-email, .atosy-contact-card-v2-phone ) { background: #0C2D5D !important; background-image: none !important; background-color: #0C2D5D !important; border: 1px solid rgba(154,201,255,.30) !important; border-radius: 14px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 3px 11px rgba(0,10,34,.09) !important; } /* No secondary painted bands in header or field wrappers. */ html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 :is( .atosy-contact-card-v2-head, .atosy-contact-card-v2-heading, .atosy-contact-card-v2-fields, .atosy-subject-detail-v5-edit-field ) { background: transparent !important; background-image: none !important; background-color: transparent !important; box-shadow: none !important; } /* Preserve the darker, clearly identifiable input areas. */ html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 :is(input,select,textarea):not(:disabled) { background: rgba(5,34,77,.90) !important; border-color: rgba(154,201,255,.30) !important; color: #F7FBFF !important; -webkit-text-fill-color: #F7FBFF !important; } /* Keep + button Sapphire, not emerald. */ html body .atosy-subject-detail-v5-overlay .atosy-contact-card-v2 .atosy-contact-card-v2-add { background: linear-gradient( 145deg,#16457D,#0B2B5B ) !important; color: #D9EBFF !important; -webkit-text-fill-color: #D9EBFF !important; } /* 295g END */ /* ========================================================== 295i — REMOVE CONTACT CARDS GAP BACKGROUND Root cause: old gradient on .atosy-contact-cards-v2. The 12px gap exposes the wrapper background. ========================================================== */ html body .atosy-subject-detail-v5-overlay .atosy-communication-group-v1-direct .atosy-contact-cards-v2 { background: transparent !important; background-image: none !important; background-color: transparent !important; box-shadow: none !important; } /* Preserve the 12px gap and each card's Navy Liquid surface. */ /* 295i END */ /* ========================================================== 296b — CUSTOM FIELD MODAL SAPPHIRE NAVY LIQUID Only the Subject custom-field popup. ========================================================== */ html body.atosy-view-subject .atosy-custom-field-modal-v1 { color: #F7FBFF !important; } /* Main glass shell: matching Object Category palette. */ html body.atosy-view-subject .atosy-custom-field-modal-v1-card { background: radial-gradient( ellipse at 98% 0%, rgba(86,154,237,.14), transparent 57% ), linear-gradient( 145deg, rgba(10,52,108,.98), rgba(5,27,66,.99) ) !important; color: #F7FBFF !important; border: 1px solid rgba(170,207,255,.24) !important; border-radius: 22px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 26px 70px rgba(0,7,26,.34) !important; overflow: hidden !important; } /* Midnight Navy header with restrained liquid reflection. */ html body.atosy-view-subject .atosy-custom-field-modal-v1-head { background: radial-gradient( ellipse at 95% 0%, rgba(111,174,243,.21), transparent 64% ), linear-gradient( 110deg, #061C43 0%, #0A346C 68%, #11477D 100% ) !important; color: #F7FBFF !important; border-bottom: 1px solid rgba(166,207,255,.19) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.12) !important; } html body.atosy-view-subject .atosy-custom-field-modal-v1-head :is(h1,h2,h3,strong,span,p,small) { color: #F7FBFF !important; -webkit-text-fill-color: #F7FBFF !important; } /* Navy body and footer, no white strips. */ html body.atosy-view-subject .atosy-custom-field-modal-v1-body { background: rgba(6,29,68,.30) !important; color: #E4F0FF !important; } html body.atosy-view-subject .atosy-custom-field-modal-v1-actions { background: rgba(3,22,55,.43) !important; border-top: 1px solid rgba(154,201,255,.17) !important; } /* All labels and descriptive text remain readable. */ html body.atosy-view-subject .atosy-custom-field-modal-v1-body :is(label,small,p) { color: #C7DCF5 !important; -webkit-text-fill-color: #C7DCF5 !important; } /* Preserve native select arrows and existing layout. */ html body.atosy-view-subject .atosy-custom-field-modal-v1-body :is(input,select,textarea) { background-color: rgba(5,34,77,.94) !important; color: #F7FBFF !important; -webkit-text-fill-color: #F7FBFF !important; border: 1px solid rgba(154,201,255,.34) !important; border-radius: 11px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.09) !important; color-scheme: dark; } html body.atosy-view-subject .atosy-custom-field-modal-v1-body :is(input,textarea)::placeholder { color: #9EBAD8 !important; -webkit-text-fill-color: #9EBAD8 !important; opacity: 1 !important; } html body.atosy-view-subject .atosy-custom-field-modal-v1-body :is(input,select,textarea):focus { border-color: rgba(167,213,255,.77) !important; outline: none !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 0 0 2px rgba(76,151,239,.16) !important; } html body.atosy-view-subject .atosy-custom-field-modal-v1-body select option { background: #092B60 !important; color: #F7FBFF !important; } /* Glass close and cancel controls. */ html body.atosy-view-subject .atosy-custom-field-modal-v1-x, html body.atosy-view-subject .atosy-custom-field-modal-v1-cancel { background: rgba(134,181,231,.12) !important; color: #E6F3FF !important; -webkit-text-fill-color: #E6F3FF !important; border: 1px solid rgba(178,215,255,.26) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important; } html body.atosy-view-subject .atosy-custom-field-modal-v1-x:hover, html body.atosy-view-subject .atosy-custom-field-modal-v1-cancel:hover { background: rgba(134,181,231,.21) !important; } /* Refined Sapphire Liquid primary action. */ html body.atosy-view-subject .atosy-custom-field-modal-v1-create { background: linear-gradient( 145deg, #2466B1, #164D96 52%, #103B79 ) !important; color: #FFFFFF !important; -webkit-text-fill-color: #FFFFFF !important; border: 1px solid rgba(189,221,255,.37) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 4px 13px rgba(2,15,43,.16) !important; } html body.atosy-view-subject .atosy-custom-field-modal-v1-create:hover { background: linear-gradient( 145deg, #2B73C4, #1C57A5 52%, #144588 ) !important; } html body.atosy-view-subject .atosy-custom-field-modal-v1 button:focus-visible { outline: 2px solid rgba(184,219,255,.82) !important; outline-offset: 2px !important; } /* 296b END */