/* Plataforma Control Facility V11.10 · identidad celeste turquesa TRESA */
:root {
  --teal: #0aa6c8 !important;
  --navy: #086f8b !important;
  --blue: #098fba !important;
  --bg: #f2f9fb !important;
  --ink: #173947 !important;
  --muted: #617982 !important;
  --line: #dcebef !important;
  --cf-turquoise: #0aa6c8;
  --cf-turquoise-dark: #087f9e;
  --cf-turquoise-deep: #075f77;
  --cf-turquoise-pale: #e7f7fb;
  --cf-surface: #ffffff;
}

html {
  font-size: 16px;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body,
button,
input,
select,
textarea,
table {
  font-family:
    Aptos, "Segoe UI Variable", "Segoe UI", Inter, ui-sans-serif, system-ui,
    sans-serif !important;
}

body {
  color: var(--ink) !important;
  font-size: 15px !important;
  line-height: 1.48;
  background: linear-gradient(
    135deg,
    #eef9fc 0%,
    #fff 58%,
    #e5f5f9 100%
  ) !important;
}

.sidebar {
  width: 260px !important;
  padding: 22px 17px !important;
  background: linear-gradient(
    180deg,
    #0aa6c8 0%,
    #087f9e 55%,
    #075f77 100%
  ) !important;
  box-shadow: 8px 0 30px rgba(7, 95, 119, 0.13);
}

.main {
  margin-left: 260px !important;
  width: calc(100% - 260px) !important;
  padding: 0 36px 48px !important;
}

.brand {
  gap: 13px !important;
  min-height: 68px;
  padding: 0 5px 22px !important;
}

.brandmark {
  flex: 0 0 58px !important;
  width: 58px !important;
  height: 54px !important;
  border-radius: 12px !important;
  background: #fff url("/logo-tresa.png") center / contain no-repeat !important;
  color: transparent !important;
  font-size: 0 !important;
  box-shadow: 0 8px 22px rgba(4, 78, 99, 0.22) !important;
}

.brand strong {
  font-size: 15px !important;
  font-weight: 800 !important;
  letter-spacing: 0.045em !important;
}

.brand span {
  color: #dff8fe !important;
  font-size: 10px !important;
  font-weight: 650 !important;
  letter-spacing: 0.105em !important;
}

.site-switch {
  margin-bottom: 22px !important;
  border-color: rgba(255, 255, 255, 0.32) !important;
  background: rgba(5, 89, 112, 0.42) !important;
}

.site-switch small,
.site-switch b {
  font-size: 11px !important;
}

.site-switch select {
  border-color: #9dddeb !important;
  color: var(--cf-turquoise-deep) !important;
  font-size: 12px !important;
}

.new-site-button {
  border-color: #a5e0ec !important;
  background: #ecfaff !important;
  color: var(--cf-turquoise-deep) !important;
  font-size: 11px !important;
}

.sidebar nav {
  gap: 6px !important;
}

.sidebar nav button,
.sidebar-foot button {
  min-height: 44px !important;
  padding: 11px 12px !important;
  color: #e4f8fc !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em;
}

.sidebar nav button.active {
  background: #16b6d5 !important;
  color: #fff !important;
  box-shadow: 0 7px 18px rgba(3, 76, 96, 0.25) !important;
}

.sidebar nav button i {
  width: 30px !important;
  font-size: 18px !important;
}

.user b {
  font-size: 12px !important;
}
.user small {
  color: #d0eff6 !important;
  font-size: 10px !important;
}
.user > span {
  background: #fff !important;
  color: var(--cf-turquoise-dark) !important;
}

.top-strip {
  color: #68828c !important;
  font-size: 10px !important;
}

.top-strip b {
  color: var(--cf-turquoise-deep) !important;
  font-size: 12px !important;
}

header {
  height: 104px !important;
  margin-bottom: 22px !important;
}

header h1 {
  color: #123c4a !important;
  font-size: clamp(25px, 2.3vw, 31px) !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em;
}

header p,
.toolbar p,
.panel-head p,
.installation-selector p {
  color: var(--muted) !important;
  font-size: 13px !important;
}

.eyebrow,
.nav-label {
  color: var(--cf-turquoise-dark) !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  letter-spacing: 0.13em !important;
}

.primary,
.connection-warning button {
  border-color: var(--cf-turquoise) !important;
  background: var(--cf-turquoise) !important;
  color: #fff !important;
}

.primary:hover,
.connection-warning button:hover {
  border-color: var(--cf-turquoise-dark) !important;
  background: var(--cf-turquoise-dark) !important;
}

.primary,
.secondary,
.icon-btn,
.danger-button,
.complete,
.segmented button,
.panel-head button {
  font-size: 12px !important;
  font-weight: 750 !important;
}

.panel,
.kpis article,
.filters-card,
.asset-profile,
.installation-selector,
.bulk-import-card {
  border-color: var(--line) !important;
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow: 0 8px 28px rgba(7, 95, 119, 0.07) !important;
}

.panel,
.kpis article {
  border-radius: 14px !important;
}

.panel {
  padding: 22px !important;
}
.kpis article {
  padding: 19px !important;
}
.kpi-top span {
  font-size: 11px !important;
  font-weight: 800 !important;
}
.kpis strong {
  color: #143f4d;
  font-size: 32px !important;
  font-weight: 800 !important;
}
.kpis p {
  font-size: 11px !important;
}

.panel-head h2,
.toolbar h2,
.installation-selector h2 {
  color: #143f4d !important;
  font-size: 17px !important;
  font-weight: 800 !important;
}

.process-flow button {
  border-color: #d6e9ee !important;
  padding: 15px !important;
}

.process-flow b {
  font-size: 13px !important;
}
.process-flow small {
  font-size: 10px !important;
}
.process-flow button.current {
  border-color: var(--cf-turquoise) !important;
}
.process-flow button > span {
  background: var(--cf-turquoise-pale) !important;
  color: var(--cf-turquoise-dark) !important;
}

.installation-intro {
  background: linear-gradient(
    155deg,
    var(--cf-turquoise-dark),
    var(--cf-turquoise)
  ) !important;
}

.installation-intro h2 {
  font-size: 30px !important;
  font-weight: 800 !important;
}
.installation-intro p {
  color: #eafaff !important;
  font-size: 14px !important;
}
.installation-form label,
.filter-row label,
.modal label,
.life-search label {
  color: #456873 !important;
  font-size: 12px !important;
  font-weight: 750 !important;
}

input,
select,
textarea,
.search {
  color: #173947 !important;
  font-size: 13px !important;
}

.installation-form input,
.installation-form select,
.modal input,
.modal select,
.modal textarea,
.filter-row select,
.life-search input,
.life-search select {
  min-height: 43px;
  border-color: #cfe3e8 !important;
}

.installation-form input:focus,
.installation-form select:focus,
.modal input:focus,
.modal select:focus,
.modal textarea:focus {
  border-color: var(--cf-turquoise) !important;
  box-shadow: 0 0 0 3px rgba(10, 166, 200, 0.14) !important;
}

table {
  font-size: 13px !important;
}
th {
  color: #58727c !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.055em !important;
  padding: 12px 11px !important;
}

td {
  color: #244752 !important;
  font-size: 12.5px !important;
  padding: 14px 11px !important;
}

td small {
  font-size: 10px !important;
}
.task {
  line-height: 1.4;
}
.badge {
  font-size: 10px !important;
}

.calendar {
  border-color: var(--line) !important;
}
.cal-head h3 {
  color: #173f4c !important;
  font-size: 16px !important;
  font-weight: 800 !important;
}
.weekdays b {
  color: #526f79 !important;
  font-size: 10px !important;
}
.days span {
  font-size: 11px !important;
}
.event {
  border-left-color: #3184b8 !important;
  background: #e7f3fb !important;
  color: #185f8c !important;
  font-size: 9.5px !important;
}
.event.vencida {
  border-color: #d63b32 !important;
  background: #fde9e7 !important;
  color: #b3261e !important;
}
.event.realizada {
  border-color: #28a060 !important;
  background: #e7f7ed !important;
  color: #126b3d !important;
}
.event.proxima-vencer {
  border-color: #e8ad23 !important;
  background: #fff3cd !important;
  color: #805500 !important;
}
.red-dot {
  background: #d63b32 !important;
}
.green-dot {
  background: #28a060 !important;
}
.amber-dot {
  background: #e8ad23 !important;
}
.blue-dot {
  background: #3184b8 !important;
}
.legend {
  flex-wrap: wrap;
  padding: 0 12px 14px;
}
.days .today span {
  background: var(--cf-turquoise) !important;
}

.asset-cards button,
.life-list > button {
  border-color: #d7e9ed !important;
  border-radius: 12px !important;
}

.asset-cards span,
.profile-main span,
.life-list strong,
.evidence,
.panel-head button,
.asset-link:hover b {
  color: var(--cf-turquoise-dark) !important;
}

.asset-cards b {
  font-size: 15px !important;
}
.asset-cards small {
  font-size: 11px !important;
}
.profile-main h2 {
  color: #153f4d !important;
  font-size: 24px !important;
}
.profile-main p {
  font-size: 13px !important;
}
.profile-grid span {
  font-size: 9px !important;
}
.profile-grid b {
  font-size: 12px !important;
}
.asset-avatar,
.life-photo,
.back {
  background: var(--cf-turquoise-pale) !important;
  color: var(--cf-turquoise-dark) !important;
}

.modal {
  border: 1px solid #d8e8ec;
  border-radius: 16px !important;
  box-shadow: 0 32px 90px rgba(6, 66, 84, 0.28) !important;
}

.modal-head h2 {
  color: #153f4d;
  font-size: 21px !important;
  font-weight: 800 !important;
}
.modal-head p {
  font-size: 12px !important;
}
.toast {
  background: var(--cf-turquoise-deep) !important;
  font-size: 12px !important;
}
.connection-warning {
  border-color: #7cd5e6 !important;
  background: #eaf9fc !important;
  color: #075f77 !important;
}
.bulk-import-card {
  background: linear-gradient(90deg, #f7fdff, #e8f8fc) !important;
}
.bulk-import-card b {
  color: var(--cf-turquoise-deep) !important;
  font-size: 14px !important;
}
.bulk-import-card span,
.bulk-import-card small {
  font-size: 11px !important;
}

.dashboard-filter-head,
.dashboard-context {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.dashboard-filter-head b {
  color: #143f4d;
  font-size: 16px;
  font-weight: 800;
}

.dashboard-filter-head p {
  margin: 5px 0 0;
}

.dashboard-clear {
  flex: 0 0 auto;
  cursor: pointer;
  border: 1px solid #9fd6e3;
  border-radius: 8px;
  background: #eefaff;
  color: var(--cf-turquoise-deep);
  padding: 9px 13px;
  font-size: 11px;
  font-weight: 800;
}

.dashboard-context {
  margin-top: 14px;
  border-top: 1px solid #dcecef;
  padding-top: 12px;
  color: #5b747e;
  font-size: 11px;
}

.dashboard-context strong {
  color: var(--cf-turquoise-deep);
  font-size: 12px;
}

.filter-row select:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}

.kpis article.kpi-clickable {
  cursor: pointer;
  transition:
    transform 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.kpis article.kpi-clickable:hover,
.kpis article.kpi-clickable:focus-visible {
  transform: translateY(-2px);
  border-color: #78cce0 !important;
  outline: none;
}

.kpis article.kpi-active {
  border-color: var(--cf-turquoise) !important;
  box-shadow:
    0 0 0 3px rgba(10, 166, 200, 0.12),
    0 10px 26px rgba(7, 95, 119, 0.1) !important;
}

.bar-row {
  grid-template-columns: minmax(135px, 190px) minmax(130px, 1fr) minmax(
      125px,
      auto
    ) !important;
}

.bar-row > b {
  color: #3f5f69;
  white-space: nowrap;
  font-size: 10px;
}

.bar-row i.dashboard-bar-done {
  background: #28a060 !important;
}
.bar-row i.dashboard-bar-warn {
  background: #e8ad23 !important;
}
.bar-row i.dashboard-bar-bad {
  background: #d63b32 !important;
}
.bar-row i.dashboard-bar-base {
  background: var(--cf-turquoise) !important;
}

.dashboard-empty {
  margin-top: 12px;
  border: 1px dashed #bfdde5;
  border-radius: 9px;
  background: #f7fcfe;
  color: #67808a;
  padding: 18px;
  text-align: center;
  font-size: 12px;
}

.management-row {
  cursor: pointer;
  border-radius: 8px;
  padding-inline: 7px !important;
}

.management-row:hover,
.management-row:focus-visible {
  background: #effaff;
  outline: 2px solid rgba(10, 166, 200, 0.18);
}

.asset-list-actions {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 150px;
}

.asset-list-delete {
  min-height: 29px;
  padding: 5px 9px !important;
  font-size: 10px !important;
  white-space: nowrap;
}

.asset-list-delete:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

@media (max-width: 760px) {
  .sidebar {
    width: 78px !important;
    padding: 18px 10px !important;
  }
  .main {
    margin-left: 78px !important;
    width: calc(100% - 78px) !important;
    padding: 0 15px 26px !important;
  }
  .brand {
    justify-content: center;
    padding-left: 0 !important;
  }
  .brandmark {
    flex-basis: 54px !important;
    width: 54px !important;
    height: 50px !important;
  }
  header {
    height: 86px !important;
  }
  .dashboard-filter-head,
  .dashboard-context {
    align-items: flex-start;
    flex-direction: column;
  }
  .dashboard-clear {
    width: 100%;
  }
  .bar-row {
    grid-template-columns: minmax(110px, 150px) 1fr !important;
  }
  .bar-row > b {
    grid-column: 1 / -1;
    text-align: left;
  }
}

@media (max-width: 500px) {
  body {
    font-size: 14px !important;
  }
  .main header h1 {
    font-size: 22px !important;
  }
  .panel {
    padding: 16px !important;
  }
  td {
    font-size: 12px !important;
  }
  .asset-list-actions {
    min-width: 130px;
  }
}

/* V11.15 · paleta celeste turquesa unificada en toda la plataforma */
:root {
  --teal: #0aa6c8 !important;
  --navy: #087f9e !important;
  --blue: #0aa6c8 !important;
  --bg: #f2fbfd !important;
  --line: #d2eaf0 !important;
  --cf-turquoise: #0aa6c8 !important;
  --cf-turquoise-dark: #087f9e !important;
  --cf-turquoise-deep: #075f77 !important;
  --cf-turquoise-mid: #43bdd5 !important;
  --cf-turquoise-soft: #bdeaf3 !important;
  --cf-turquoise-pale: #e7f8fb !important;
  --cf-turquoise-faint: #f5fcfd !important;
}

body {
  background: linear-gradient(
    135deg,
    #eaf8fb 0%,
    #ffffff 55%,
    #def3f7 100%
  ) !important;
}

.sidebar {
  background: linear-gradient(
    180deg,
    #13aecb 0%,
    #0a95b2 52%,
    #08768f 100%
  ) !important;
}

.site-switch {
  border-color: rgba(255, 255, 255, 0.38) !important;
  background: rgba(5, 100, 124, 0.38) !important;
}

.sidebar nav button:hover,
.sidebar-foot button:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #fff !important;
}

.sidebar nav button.active {
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  background: #3ec0d8 !important;
  box-shadow: 0 8px 20px rgba(4, 78, 99, 0.24) !important;
}

.top-strip {
  border-bottom-color: var(--cf-turquoise-soft) !important;
  background: rgba(255, 255, 255, 0.92) !important;
}

header {
  border-bottom-color: var(--cf-turquoise-soft) !important;
}

.primary,
.connection-warning button {
  border-color: var(--cf-turquoise) !important;
  background: var(--cf-turquoise) !important;
  color: #fff !important;
  box-shadow: 0 5px 13px rgba(10, 166, 200, 0.14);
}

.primary:hover,
.connection-warning button:hover {
  border-color: var(--cf-turquoise-dark) !important;
  background: var(--cf-turquoise-dark) !important;
}

.secondary,
.icon-btn,
.new-site-button,
.dashboard-clear,
.panel-head button,
.complete {
  border-color: #9fdbe7 !important;
  background: var(--cf-turquoise-pale) !important;
  color: var(--cf-turquoise-deep) !important;
}

.secondary:hover,
.icon-btn:hover,
.new-site-button:hover,
.dashboard-clear:hover,
.panel-head button:hover,
.complete:hover {
  border-color: var(--cf-turquoise-mid) !important;
  background: #d8f3f8 !important;
}

.installation-selector,
.filters-card,
.panel,
.kpis article,
.asset-profile,
.bulk-import-card,
.installation-card {
  border-color: var(--cf-turquoise-soft) !important;
}

.installation-selector,
.filters-card,
.panel,
.kpis article,
.asset-profile {
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow: 0 8px 28px rgba(7, 95, 119, 0.07) !important;
}

.installation-intro {
  background: linear-gradient(
    155deg,
    var(--cf-turquoise-dark),
    var(--cf-turquoise-mid)
  ) !important;
}

.process-flow button,
.asset-cards button,
.life-list > button,
.cert-summary div {
  border-color: var(--cf-turquoise-soft) !important;
  background: #fff !important;
}

.process-flow button:hover,
.asset-cards button:hover,
.life-list > button:hover {
  border-color: var(--cf-turquoise-mid) !important;
  background: var(--cf-turquoise-faint) !important;
}

.process-flow button.current {
  border-color: var(--cf-turquoise) !important;
  background: var(--cf-turquoise-faint) !important;
  box-shadow: 0 0 0 3px rgba(10, 166, 200, 0.12) !important;
}

.process-flow button > span,
.asset-icon,
.asset-avatar,
.life-photo,
.back,
.user > span {
  background: var(--cf-turquoise-pale) !important;
  color: var(--cf-turquoise-dark) !important;
}

.kpi-top i.blue,
.kpi-top i.gray,
.kpi-top i.violet,
.kpi-top i.green {
  background: var(--cf-turquoise-pale) !important;
  color: var(--cf-turquoise-dark) !important;
}

.kpis article:not(.kpi-status-alert) strong.blue,
.kpis article:not(.kpi-status-alert) strong.ok {
  background: transparent !important;
  color: var(--cf-turquoise-deep) !important;
}

.progress,
.bar-row > div {
  background: #dff1f5 !important;
}

.progress i,
.progress.purple i,
.mini-bars i,
.bar-row i.dashboard-bar-base {
  background: var(--cf-turquoise) !important;
}

.segmented {
  border: 1px solid var(--cf-turquoise-soft) !important;
  background: var(--cf-turquoise-pale) !important;
}

.segmented button {
  color: var(--cf-turquoise-deep) !important;
}

.segmented .selected {
  background: var(--cf-turquoise) !important;
  color: #fff !important;
  box-shadow: 0 3px 9px rgba(7, 95, 119, 0.16) !important;
}

.search,
.filters select,
.filter-row select,
.installation-selector-actions select,
.installation-form input,
.installation-form select,
.modal input,
.modal select,
.modal textarea,
.life-search input,
.life-search select {
  border-color: #c1e3ea !important;
  background: #fbfeff !important;
}

.search:focus-within,
.filters select:focus,
.filter-row select:focus,
.installation-selector-actions select:focus,
.life-search input:focus,
.life-search select:focus {
  border-color: var(--cf-turquoise) !important;
  box-shadow: 0 0 0 3px rgba(10, 166, 200, 0.12) !important;
  outline: none;
}

th,
.weekdays b {
  background: var(--cf-turquoise-faint) !important;
}

th,
td,
.toolbar,
.dashboard-context,
.profile-grid,
.profile-grid div,
.next-item,
.calendar,
.cal-head,
.days > div {
  border-color: var(--line) !important;
}

tbody tr:hover {
  background: var(--cf-turquoise-faint) !important;
}

.calendar,
.month {
  border-color: var(--cf-turquoise-soft) !important;
  background: #fff !important;
}

.days .outside,
.month > b {
  background: var(--cf-turquoise-faint) !important;
}

.month > button {
  border-color: var(--cf-turquoise-soft) !important;
  border-left-color: var(--cf-turquoise) !important;
  background: #fff !important;
}

.month > button:hover {
  border-color: var(--cf-turquoise-mid) !important;
  background: var(--cf-turquoise-faint) !important;
}

.month > button > span,
.date:not(.late),
.evidence,
.check,
.asset-cards span,
.profile-main span,
.life-list strong,
.asset-link:hover b {
  color: var(--cf-turquoise-dark) !important;
}

.date:not(.late) {
  background: var(--cf-turquoise-pale) !important;
}

.bulk-import-card,
.connection-warning {
  border-color: #8dd5e3 !important;
  background: linear-gradient(90deg, #f5fcfd, #e3f7fb) !important;
  color: var(--cf-turquoise-deep) !important;
}

.toast {
  color: #fff !important;
  background: var(--cf-turquoise-deep) !important;
}

.loading-screen {
  color: var(--cf-turquoise-deep) !important;
  background: rgba(235, 249, 252, 0.94) !important;
}

.modal {
  border-color: var(--cf-turquoise-soft) !important;
}

/* Colores funcionales: se reservan para estados operativos y acciones críticas. */
.event.vencida,
.date.late,
.kpi-top i.red,
.danger,
.red-text,
.danger-button,
.asset-list-delete {
  color: #b3261e !important;
}

.event.vencida,
.date.late,
.kpi-top i.red {
  border-color: #d63b32 !important;
  background: #fde9e7 !important;
}

.event.proxima-vencer,
.event.en-ejecución,
.kpi-top i.amber {
  border-color: #e8ad23 !important;
  background: #fff3cd !important;
  color: #805500 !important;
}

.event.realizada {
  border-color: #28a060 !important;
  background: #e7f7ed !important;
  color: #126b3d !important;
}

/* V11.16 · color corporativo TRESA tomado del logotipo (#08ABEB) */
:root {
  --teal: #08abeb !important;
  --navy: #047faa !important;
  --blue: #08abeb !important;
  --bg: #effaff !important;
  --ink: #123747 !important;
  --muted: #567583 !important;
  --line: #cbeaf6 !important;
  --cf-turquoise: #08abeb !important;
  --cf-turquoise-dark: #047faa !important;
  --cf-turquoise-deep: #02435c !important;
  --cf-turquoise-mid: #5ac7f1 !important;
  --cf-turquoise-soft: #9fdef7 !important;
  --cf-turquoise-pale: #e4f7fe !important;
  --cf-turquoise-faint: #f4fbfe !important;
}

body {
  background: linear-gradient(
    135deg,
    #e9f8fe 0%,
    #ffffff 54%,
    #dff4fc 100%
  ) !important;
}

.sidebar {
  background: linear-gradient(
    180deg,
    #12b6ef 0%,
    #08abeb 48%,
    #047faa 100%
  ) !important;
  box-shadow: 8px 0 30px rgba(2, 67, 92, 0.15) !important;
}

.site-switch {
  border-color: rgba(255, 255, 255, 0.52) !important;
  background: rgba(2, 67, 92, 0.26) !important;
}

.sidebar nav button.active {
  border-color: rgba(255, 255, 255, 0.65) !important;
  background: #02435c !important;
  box-shadow: 0 8px 20px rgba(2, 67, 92, 0.28) !important;
}

.sidebar nav button:hover,
.sidebar-foot button:hover {
  background: rgba(2, 67, 92, 0.28) !important;
}

.primary,
.connection-warning button {
  border-color: #08abeb !important;
  background: #08abeb !important;
}

.primary:hover,
.connection-warning button:hover {
  border-color: #047faa !important;
  background: #047faa !important;
}

.secondary,
.icon-btn,
.new-site-button,
.dashboard-clear,
.panel-head button,
.complete {
  border-color: #9fdef7 !important;
  background: #e4f7fe !important;
  color: #02435c !important;
}

.panel,
.filters-card,
.installation-selector,
.installation-card,
.asset-profile,
.bulk-import-card,
.kpis article {
  border-color: #b9e4f5 !important;
  box-shadow: 0 9px 28px rgba(4, 127, 170, 0.08) !important;
}

.installation-intro {
  background: linear-gradient(150deg, #047faa, #08abeb 68%, #5ac7f1) !important;
}

.process-flow button.current,
.asset-cards button:hover,
.life-list > button:hover {
  border-color: #08abeb !important;
  box-shadow: 0 0 0 3px rgba(8, 171, 235, 0.14) !important;
}

.process-flow button > span,
.asset-icon,
.asset-avatar,
.life-photo,
.back,
.date:not(.late),
.user > span {
  background: #e4f7fe !important;
  color: #047faa !important;
}

.eyebrow,
.nav-label,
.panel-head button,
.asset-cards span,
.profile-main span,
.life-list strong,
.evidence,
.asset-link:hover b {
  color: #047faa !important;
}

.progress i,
.progress.purple i,
.mini-bars i,
.bar-row i.dashboard-bar-base {
  background: #08abeb !important;
}

input:focus,
select:focus,
textarea:focus,
.search:focus-within {
  border-color: #08abeb !important;
  box-shadow: 0 0 0 3px rgba(8, 171, 235, 0.14) !important;
  outline: none;
}

/* Acciones de proveedor: botones separados, legibles y sin superposición. */
.inline-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  min-width: 194px !important;
  white-space: nowrap !important;
}

.inline-actions button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 82px !important;
  min-height: 34px !important;
  margin: 0 !important;
  border-radius: 8px !important;
  padding: 7px 12px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

.inline-actions .danger.small {
  min-width: 96px !important;
  cursor: pointer !important;
  border: 1px solid #e3a29e !important;
  background: #fff2f1 !important;
  color: #b3261e !important;
}

.inline-actions .danger.small:hover {
  border-color: #d63b32 !important;
  background: #fde4e2 !important;
}

.inline-actions button:disabled {
  cursor: not-allowed !important;
  opacity: 0.52 !important;
}

/* Módulo de gestión por proveedor. */
.provider-report-filters {
  margin-bottom: 16px;
}

.provider-filter-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 14px;
}

.provider-filter-grid label {
  color: #456873;
  font-size: 10.5px;
  font-weight: 850;
  letter-spacing: 0.04em;
}

.provider-filter-grid select,
.provider-filter-grid input {
  display: block;
  width: 100%;
  min-height: 43px;
  margin-top: 6px;
  border: 1px solid #b9e0ef;
  border-radius: 8px;
  background: #fbfeff;
  color: #173947;
  padding: 9px 11px;
  font-size: 12px;
}

.provider-report-context {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 15px;
  border-top: 1px solid #cbeaf6;
  padding-top: 13px;
  color: #5a7681;
  font-size: 11px;
}

.provider-report-context strong,
.provider-result-count {
  color: #02435c;
  font-size: 12px;
}

.provider-kpis {
  grid-template-columns: repeat(5, minmax(145px, 1fr)) !important;
}

.provider-report-table .task {
  max-width: 310px;
  white-space: normal;
}

.provider-report-table td:nth-child(2),
.provider-report-table td:nth-child(3) {
  min-width: 145px;
}

/* Los colores de estado continúan siendo operativos. */
.badge.green {
  border-color: #9bd6b6 !important;
  background: #e7f7ed !important;
  color: #126b3d !important;
}

.kpis strong.ok {
  color: #138a55 !important;
}

.kpis strong.warn {
  color: #b06b0c !important;
}

.kpis strong.bad {
  color: #b3261e !important;
}

@media (max-width: 1200px) {
  .provider-filter-grid {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
  }

  .provider-kpis {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

@media (max-width: 850px) {
  .provider-filter-grid {
    grid-template-columns: repeat(2, minmax(140px, 1fr));
  }

  .provider-kpis {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 600px) {
  .provider-filter-grid,
  .provider-kpis {
    grid-template-columns: 1fr !important;
  }

  .provider-report-context {
    align-items: flex-start;
    flex-direction: column;
  }

  .inline-actions {
    min-width: 120px !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .inline-actions button,
  .inline-actions .danger.small {
    width: 100% !important;
    min-width: 0 !important;
  }
}

/* V11.19: controles iniciales sin duplicados. */
body.cf-installation-page .site-switch {
  display: none !important;
}

button.cf-duplicate-action,
button.cf-duplicate-action[hidden] {
  display: none !important;
}

/* V11.17: navegación y programación preventiva. */
.site-switch .new-site-button {
  display: none !important;
}

.sidebar nav button {
  line-height: 1.25;
  white-space: normal;
}

.calendar .days > div[role="button"] {
  cursor: pointer;
  transition: background-color 0.16s ease, box-shadow 0.16s ease;
}

.calendar .days > div[role="button"]:hover {
  background: #eefaff !important;
  box-shadow: inset 0 0 0 2px rgba(8, 171, 235, 0.24);
}

.calendar .days > div[role="button"]:focus-visible {
  outline: 2px solid #08abeb;
  outline-offset: -2px;
}

.calendar .days > div[role="button"]::after {
  content: "+";
  position: absolute;
  top: 6px;
  right: 7px;
  color: #08abeb;
  font-size: 13px;
  font-weight: 900;
  opacity: 0;
}

.calendar .days > div[role="button"]:hover::after,
.calendar .days > div[role="button"]:focus-visible::after {
  opacity: 1;
}

.cf-frequency-field select {
  border-color: #9edcf3 !important;
  background: #f5fcff !important;
}

.event.cf-generated-event {
  border-style: solid;
}

/* V11.18: acceso único de ingreso y datos contractuales de proveedores. */
.process-flow.cf-installation-only {
  grid-template-columns: minmax(260px, 390px) !important;
}

.process-flow.cf-installation-only button {
  border-color: #79d2f2 !important;
  background: linear-gradient(135deg, #ffffff, #effaff) !important;
}

.cf-contract-hidden {
  display: none !important;
}

th[data-cf-provider-column],
td[data-cf-provider-column] {
  white-space: nowrap;
}

td[data-cf-provider-column="contract"] {
  color: #087daf;
  font-weight: 800;
}

@media (max-width: 600px) {
  .process-flow.cf-installation-only {
    grid-template-columns: 1fr !important;
    max-width: none;
  }
}
