/* ── ProjectConfiguration.razor ── */ .pcfg-page { padding: 1.5rem; } .pcfg-banner { background: var(--atlas-white); padding: 1.25rem 2rem; border-radius: 12px; box-shadow: var(--atlas-shadow-1); display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; border-left: 5px solid var(--atlas-blue-600); } .pcfg-banner-title { font-size: 1.4rem; font-weight: 700; color: var(--atlas-gray-900); } .pcfg-banner-sub { font-size: .875rem; color: var(--atlas-gray-500); margin-top: .2rem; } /* ── ProjectRulesTab.razor ── */ /* .pcfg-section-banner/.pcfg-section-title/.pcfg-section-sub son idénticas byte a byte en AccessControlConfigTab.razor y GeneralConfigTab.razor — se quedan aquí como única copia (primer fichero del lote que las define); las otras dos las borraron sin recopiar. */ .pcfg-section-banner { background: var(--atlas-white); padding: 1rem 1.5rem; border-radius: 10px; box-shadow: var(--atlas-shadow-1); border-left: 4px solid var(--atlas-blue-600); } .pcfg-section-title { font-size: 1.1rem; font-weight: 700; color: var(--atlas-gray-900); } .pcfg-section-sub { font-size: .82rem; color: var(--atlas-gray-500); margin-top: .15rem; max-width: 720px; } .pcfg-rules-table tbody tr td:first-child { padding-left: .5rem; } .pcfg-rules-table .pcfg-rule-desc { font-size: .8rem; color: var(--atlas-gray-500); } .pcfg-rules-table .pcfg-rule-name { font-weight: 600; color: var(--atlas-gray-900); } .pcfg-rules-table .pcfg-cat { font-size: .72rem; letter-spacing: .04em; padding: .15rem .55rem; border-radius: 999px; background: var(--atlas-indigo-50); color: var(--atlas-indigo-800); font-weight: 600; } .pcfg-rules-table tr.row-disabled { opacity: .55; } /* Unsaved (pending) highlight — amber wash + left accent on the rule row and its items sub-row. */ .pcfg-rules-table tr.row-pending > td { background: var(--atlas-amber-50); } .pcfg-rules-table tr.row-pending > td:first-child { box-shadow: inset 3px 0 0 var(--atlas-amber-500); } .pcfg-rules-table tr.pcfg-items-row.row-pending > td { box-shadow: inset 3px 0 0 var(--atlas-amber-500); } .pcfg-unsaved-pill { display: inline-flex; align-items: center; gap: .25rem; margin-left: .5rem; font-size: .65rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--atlas-amber-800); background: var(--atlas-amber-100); border: 1px solid #fcd34d; padding: .08rem .4rem; border-radius: 999px; vertical-align: middle; } .pcfg-unsaved-pill i { font-size: .5rem; } .pcfg-rules-table .pcfg-order-btns { display: inline-flex; flex-direction: column; gap: .1rem; } .pcfg-rules-table .pcfg-order-btns .btn { line-height: 1; padding: .05rem .35rem; } .pcfg-rules-table .pcfg-expander-btn { background: none; border: none; color: var(--atlas-blue-600); padding: .1rem 0; font-size: .78rem; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; } .pcfg-rules-table .pcfg-expander-btn:hover { text-decoration: underline; } .pcfg-rules-table .pcfg-expander-btn:disabled { color: var(--atlas-gray-400); cursor: default; } /* Item list row: toggled via the .d-none class (NOT inline style.display — WARNINGS §style.display). */ .pcfg-rules-table tr.pcfg-items-row > td { background: var(--atlas-gray-50); padding: .5rem 1rem .85rem 3rem; border-top: 0; } .pcfg-rules-table .pcfg-items-head { font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--atlas-gray-500); margin-bottom: .5rem; display: flex; align-items: center; } /* Vertical list: one item per row, stacked (decision E). */ .pcfg-rules-table .pcfg-item-list { display: flex; flex-direction: column; gap: .3rem; max-width: 640px; } /* Each item is a full-width clickable row (the whole label toggles the switch). */ .pcfg-rules-table .pcfg-item.form-switch { display: flex; align-items: center; gap: .65rem; font-size: .84rem; margin: 0; padding: .4rem .65rem; min-height: auto; background: var(--atlas-white); border: 1px solid var(--atlas-gray-200); border-radius: 8px; cursor: pointer; transition: border-color .12s, background .12s; } .pcfg-rules-table .pcfg-item.form-switch:hover { border-color: var(--atlas-indigo-200); background: #fafbff; } .pcfg-rules-table .pcfg-item.form-switch .form-check-input { float: none; margin: 0; flex-shrink: 0; cursor: pointer; } .pcfg-rules-table .pcfg-item .pcfg-item-label { flex: 1 1 auto; display: flex; align-items: center; gap: .4rem; color: var(--atlas-gray-700); } .pcfg-rules-table .pcfg-item-noenforce { font-size: .62rem; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: var(--atlas-gray-400); background: var(--atlas-gray-100); padding: .05rem .35rem; border-radius: 4px; } /* Required / Optional state tag on the right of each item. */ .pcfg-rules-table .pcfg-item-state { flex-shrink: 0; font-size: .65rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; padding: .1rem .45rem; border-radius: 999px; } .pcfg-rules-table .pcfg-item-state.req { color: var(--atlas-blue-800); background: var(--atlas-blue-100); } .pcfg-rules-table .pcfg-item-state.opt { color: var(--atlas-gray-500); background: var(--atlas-gray-100); } /* Per-item unsaved highlight. */ .pcfg-rules-table .pcfg-item.item-pending { border-color: var(--atlas-amber-500); background: var(--atlas-amber-50); box-shadow: inset 3px 0 0 var(--atlas-amber-500); } .pcfg-rules-table .pcfg-item.item-pending:hover { background: #fff7e6; } /* ── ProjectAlertsTab.razor ── */ .palt-section-banner { background: var(--atlas-white); padding: 1rem 1.5rem; border-radius: 10px; box-shadow: var(--atlas-shadow-1); border-left: 4px solid var(--atlas-blue-600); } .palt-section-title { font-size: 1.1rem; font-weight: 700; color: var(--atlas-gray-900); } .palt-section-sub { font-size: .82rem; color: var(--atlas-gray-500); margin-top: .15rem; max-width: 760px; } .palt-card { background:var(--atlas-white); border:1px solid var(--atlas-gray-200); border-radius:10px; padding:1rem 1.25rem; margin-bottom:.85rem; box-shadow:0 1px 2px rgba(0,0,0,.04); } .palt-card.row-disabled { opacity:.6; } .palt-card.row-pending { border-color:var(--atlas-amber-500); box-shadow: inset 3px 0 0 var(--atlas-amber-500); } .palt-card-head { display:flex; align-items:center; gap:.75rem; } .palt-type-name { font-weight:700; color:var(--atlas-gray-900); font-size:.95rem; } .palt-type-code { font-size:.72rem; color:var(--atlas-gray-500); font-family: var(--bs-font-monospace, monospace); } .palt-cat { font-size:.66rem; letter-spacing:.04em; padding:.12rem .5rem; border-radius:999px; background:var(--atlas-indigo-50); color:var(--atlas-indigo-800); font-weight:700; text-transform:uppercase; } .palt-override-pill { font-size:.62rem; font-weight:700; letter-spacing:.03em; text-transform:uppercase; color:var(--atlas-blue-800); background:var(--atlas-blue-100); padding:.08rem .4rem; border-radius:999px; } .palt-unsaved-pill { display:inline-flex; align-items:center; gap:.25rem; font-size:.62rem; font-weight:700; letter-spacing:.03em; text-transform:uppercase; color:var(--atlas-amber-800); background:var(--atlas-amber-100); border:1px solid #fcd34d; padding:.06rem .4rem; border-radius:999px; } .palt-body { margin-top:.85rem; } .palt-field-label { font-size:.7rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--atlas-gray-500); margin-bottom:.35rem; display:block; } /* warn_days chips */ .palt-chips { display:flex; flex-wrap:wrap; gap:.4rem; align-items:center; } .palt-chip { display:inline-flex; align-items:center; gap:.3rem; background:var(--atlas-gray-100); border:1px solid var(--atlas-gray-200); border-radius:999px; padding:.18rem .55rem; font-size:.78rem; color:var(--atlas-gray-700); } .palt-chip button { border:none; background:none; color:var(--atlas-gray-400); line-height:1; padding:0; cursor:pointer; font-size:.85rem; } .palt-chip button:hover { color:var(--atlas-red-500); } .palt-chip-add { width:70px; } /* severity map editor */ .palt-sevmap { display:flex; flex-wrap:wrap; gap:.5rem; } .palt-sevmap-row { display:flex; align-items:center; gap:.4rem; background:var(--atlas-gray-50); border:1px solid var(--atlas-gray-200); border-radius:8px; padding:.3rem .55rem; } .palt-sevmap-row .palt-day { font-size:.78rem; color:var(--atlas-gray-700); min-width:48px; text-align:right; } .palt-sevmap-row select { width:auto; } /* ── AccessControlConfigTab.razor ── */ /* .pcfg-section-banner/.pcfg-section-title/.pcfg-section-sub eliminadas aquí (idénticas a ProjectRulesTab.razor, que se queda como única copia — ver arriba). */ .pcfg-shifts-table th { font-size: .72rem; letter-spacing: .04em; text-transform: uppercase; color: var(--atlas-gray-500); } .pcfg-shifts-table td { vertical-align: middle; } .pcfg-net-hours { font-weight: 600; color: var(--atlas-gray-900); } /* Credential Design thumbnails + fullscreen viewer */ .cd-thumb { height: 130px; border-radius: 8px; overflow: hidden; background: var(--atlas-gray-50); border: 1px solid var(--atlas-gray-200); display: flex; align-items: center; justify-content: center; } .cd-thumb img { max-width: 100%; max-height: 100%; object-fit: contain; } .cd-thumb-card { width: 200px; height: 160px; } .cd-thumb-clickable { cursor: pointer; transition: box-shadow .15s ease, border-color .15s ease; } .cd-thumb-clickable:hover { border-color: var(--atlas-blue-600); box-shadow: 0 2px 10px rgba(37,99,235,.18); } .cd-json { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .72rem; white-space: pre; } /* Element+class (0,1,1) a propósito: Bootstrap carga DESPUÉS de projectConfig.css y su `.form-control-sm { min-height }` (0,1,0) ganaba por orden, aplastando el editor a dos líneas pese al min-height de `.cd-json`. Mismo motivo documentado en spools.css:331. */ textarea.cd-json { min-height: 320px; flex: 1 1 auto; resize: vertical; } /* La columna del JSON se estira a la altura de la fila (las cols de Bootstrap ya hacen stretch), así que el textarea con flex:1 se come el hueco que dejaban artwork y preview y los botones caen al fondo, alineados con el resto de la tarjeta. */ .cd-col-json { display: flex; flex-direction: column; } @media (min-width: 992px) { .cd-col { border-left: 1px solid #eef0f2; padding-left: 1.5rem; } } .cd-viewer-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.72); z-index: 1080; display: flex; align-items: center; justify-content: center; padding: 2rem; } .cd-viewer-body { position: relative; max-width: 92vw; max-height: 92vh; } .cd-viewer-body img { max-width: 92vw; max-height: 92vh; object-fit: contain; background: var(--atlas-white); border-radius: 6px; box-shadow: 0 10px 40px rgba(0,0,0,.5); } .cd-viewer-close { position: absolute; top: -14px; right: -14px; width: 36px; height: 36px; border-radius: 50%; border: none; background: var(--atlas-white); color: #111; font-size: 1.5rem; line-height: 1; cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,.35); } /* ── ZonesMapTab.razor ── */ .zones-tab { display: flex; flex-direction: column; gap: .75rem; } .zones-toolbar { background:var(--atlas-white); padding:.75rem 1rem; border-radius:10px; box-shadow:var(--atlas-shadow-1); } .zones-body { display:flex; gap:.75rem; height:70vh; } .zones-map { flex:2; border-radius:10px; overflow:hidden; box-shadow:var(--atlas-shadow-1); background:var(--atlas-gray-200); } /* 380px se quedaban cortos desde que cada capa trae slider de opacidad: el rango quedaba de pocos píxeles y era imposible de arrastrar. */ .zones-side { flex:1; min-width:340px; max-width:460px; overflow-y:auto; display:flex; flex-direction:column; gap:.75rem; } .zones-side-section { background:var(--atlas-white); padding:1rem; border-radius:10px; box-shadow:var(--atlas-shadow-1); } .zones-side-title { font-weight:700; font-size:.9rem; color:var(--atlas-gray-900); margin-bottom:.5rem; } .zones-list { list-style:none; padding:0; margin:0; max-height:220px; overflow-y:auto; } .zones-list li { padding:.4rem .5rem; border-radius:6px; cursor:pointer; font-size:.85rem; display:flex; justify-content:space-between; align-items:center; } .zones-list li:hover { background:var(--atlas-gray-100); } .zones-list li.active { background:var(--atlas-blue-100); } .zones-badge { font-size:.65rem; padding:.1rem .4rem; border-radius:4px; } .zones-badge.def { background:#dcfce7; color:#166534; } .zones-badge.res { background:var(--atlas-red-100); color:var(--atlas-red-800); } .zones-layer-row { display:block; padding:.45rem .5rem; border-radius:6px; cursor:default; } .zones-layer-row:hover { background:var(--atlas-gray-100); } .zones-layer-head { display:flex; align-items:center; gap:.4rem; } .zones-layer-name { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.85rem; } .zones-layer-btn { line-height:1; text-decoration:none; } .zones-layer-foot { display:flex; align-items:center; gap:.5rem; margin-top:.15rem; } /* min-width:0 es lo que impide que el input range se colapse: sin él, su ancho intrínseco gana al flex y el slider queda inservible en el panel estrecho. */ .zones-layer-range { flex:1 1 auto; min-width:0; margin:0; } .zones-layer-pct { font-size:.7rem; color:var(--atlas-gray-600); flex:0 0 auto; min-width:2.5rem; text-align:right; } #zones-layers-list { max-height:320px; } /* Punto de color de la zona, mismo tono que su polígono en el mapa. */ .zones-dot { flex:0 0 auto; width:.6rem; height:.6rem; border-radius:50%; display:inline-block; margin-right:.4rem; } .zones-list li > span:first-child { display:flex; align-items:center; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } /* ── GeneralConfigTab.razor ── */ /* Todo el