/* REVTEK 5000 Build 04H11C — wide workspace, readable date/time controls and clock contrast */

/* Use the available desktop canvas instead of leaving unused space at the right. */
main{width:calc(100% - 276px);max-width:none}
#view{width:100%;max-width:none;padding:20px 18px 42px}
header{padding-left:18px;padding-right:18px;min-height:82px;height:auto}
.head-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;min-width:0}
.panel,.toolbar,.table-wrap,.metrics,.grid-2,.b04-grid{width:100%;max-width:none;min-width:0}

/* Clear, visible Abuja clock in every theme. */
#revtek-live-clock.h11-clock{
  min-width:175px;
  padding:8px 13px;
  background:var(--theme-surface2,#f8fafc)!important;
  border-color:var(--theme-line,#dfe6ef)!important;
  color:var(--theme-text,#172033)!important;
  opacity:1!important;
}
#revtek-live-clock.h11-clock b{
  color:var(--theme-text,#172033)!important;
  font-size:17px;
  font-weight:900;
  opacity:1!important;
}
#revtek-live-clock.h11-clock small{
  color:var(--theme-muted,#68758a)!important;
  font-size:11px;
  font-weight:750;
  opacity:1!important;
}
html[data-theme="noc-light"] #revtek-live-clock.h11-clock{
  background:#f4f7fb!important;
  border-color:#b9c6d8!important;
  color:#172033!important;
}
html[data-theme="noc-light"] #revtek-live-clock.h11-clock b{color:#172033!important}
html[data-theme="noc-light"] #revtek-live-clock.h11-clock small{color:#526078!important}

/* All date/time fields are visibly framed, wide enough for date + time, and theme safe. */
.revtek-date-control{
  display:grid;
  grid-template-columns:minmax(205px,1fr) auto;
  align-items:stretch;
  gap:7px;
  width:100%;
  min-width:0;
  margin-top:5px;
}
.revtek-date-control input[type="datetime-local"],
.revtek-date-control input[type="date"],
.revtek-date-control input[type="time"],
input[type="datetime-local"],input[type="date"],input[type="time"]{
  width:100%!important;
  min-width:205px!important;
  min-height:42px!important;
  padding:8px 10px!important;
  border:2px solid var(--theme-line,#315386)!important;
  border-radius:8px!important;
  background:var(--theme-input,#122b53)!important;
  color:var(--theme-text,#edf5ff)!important;
  font-size:13px!important;
  font-weight:750!important;
  font-variant-numeric:tabular-nums;
  opacity:1!important;
  color-scheme:dark;
}
html[data-theme="noc-light"] input[type="datetime-local"],
html[data-theme="noc-light"] input[type="date"],
html[data-theme="noc-light"] input[type="time"]{
  background:#fff!important;
  color:#172033!important;
  border-color:#9fb0c7!important;
  color-scheme:light;
}
input[type="datetime-local"]::-webkit-datetime-edit,
input[type="date"]::-webkit-datetime-edit,
input[type="time"]::-webkit-datetime-edit{color:inherit!important;opacity:1!important}
input[type="datetime-local"]::-webkit-calendar-picker-indicator,
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator{cursor:pointer;opacity:1}
html:not([data-theme="noc-light"]) input[type="datetime-local"]::-webkit-calendar-picker-indicator,
html:not([data-theme="noc-light"]) input[type="date"]::-webkit-calendar-picker-indicator,
html:not([data-theme="noc-light"]) input[type="time"]::-webkit-calendar-picker-indicator{filter:invert(1)}
.revtek-date-ok{
  min-width:52px;
  border:1px solid var(--theme-accent,#1d62d8);
  border-radius:8px;
  background:var(--theme-accent,#1d62d8);
  color:#fff;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
  padding:0 11px;
}
.revtek-date-ok:hover{filter:brightness(1.08)}
.revtek-date-ok:focus-visible{outline:3px solid color-mix(in srgb,var(--theme-accent,#1d62d8) 32%,transparent)}
.stats-filter-grid .revtek-date-control{
  display:block;
  max-width:100%;
}
.stats-filter-grid .revtek-date-ok{display:none!important}
.stats-filter-grid .revtek-date-control input[type="datetime-local"],
.stats-filter-grid .revtek-date-control input[type="date"],
.stats-filter-grid .revtek-date-control input[type="time"]{
  min-width:0!important;
}
.revtek-calendar-label{position:relative}
.revtek-calendar-label::before{
  content:'CALENDAR · DATE & TIME';
  display:block;
  margin-bottom:4px;
  color:var(--theme-muted,#68758a);
  font-size:9px;
  font-weight:900;
  letter-spacing:.55px;
}

/* CDR calendar workspace now resembles the report filter panel and exposes time fully. */
.cdr-filter-panel{padding:20px}
.cdr-filter-grid{
  grid-template-columns:repeat(4,minmax(215px,1fr))!important;
  gap:13px!important;
  align-items:end;
}
.cdr-filter-grid label{font-size:13px!important;min-width:0}
.cdr-filter-grid input,.cdr-filter-grid select{width:100%;font-size:13px!important;min-height:42px!important}
.cdr-filter-grid .cdr-search-field{grid-column:span 2}
.cdr-filter-actions{padding-top:4px;justify-content:flex-start!important}
.cdr-filter-actions .btn{min-height:40px;font-size:13px}
.h11-filter-bar,.h11-report-filters,.h7-filter-row,.b04-toolbar{
  align-items:flex-end!important;
  gap:12px!important;
}
.h11-filter-bar label,.h11-report-filters label,.h7-filter-row label,.b04-toolbar label{
  min-width:225px!important;
  flex:1 1 225px;
}

/* Tables use the whole page first; horizontal scrolling is retained only when genuinely required. */
table{width:100%!important;max-width:none!important;font-size:13.5px}
th{font-size:11.5px!important;padding:12px 11px!important}
td{font-size:13.5px!important;padding:12px 11px!important}
.table-wrap{overflow:auto!important}
.table-wrap:not(.cdr-table):not(.live-table) table{min-width:100%!important;width:100%!important}

/* Live Calls: wider workspace and a clearly readable setup/talk column. */
.live-table{min-height:430px;width:100%}
.live-table table{min-width:1420px!important;width:100%!important;table-layout:auto}
.live-table th:nth-child(5),.live-table td:nth-child(5){
  min-width:155px;
  width:155px;
  white-space:nowrap;
  font-size:14px!important;
  font-weight:850;
}
.live-table th:nth-child(2),.live-table td:nth-child(2){min-width:175px}
.live-table th:nth-child(3),.live-table td:nth-child(3),
.live-table th:nth-child(4),.live-table td:nth-child(4){min-width:135px}
.live-table th:nth-child(6),.live-table td:nth-child(6),
.live-table th:nth-child(7),.live-table td:nth-child(7){min-width:145px}
.live-table th:nth-child(11),.live-table td:nth-child(11),
.live-table th:nth-child(12),.live-table td:nth-child(12){min-width:105px}
.live-table .btn{white-space:nowrap}
#live-search{flex:1 1 320px;min-width:280px!important}
#live-client,#live-gateway,#live-state{flex:0 1 210px;min-width:185px!important}

/* CDR uses more of the screen while keeping the full 17-column data set accessible. */
.cdr-table table{min-width:1580px!important;width:100%!important;table-layout:auto}
.cdr-table th:nth-child(1),.cdr-table td:nth-child(1){min-width:150px}
.cdr-table th:nth-child(2),.cdr-table td:nth-child(2){min-width:165px}
.cdr-table th:nth-child(12),.cdr-table td:nth-child(12),
.cdr-table th:nth-child(13),.cdr-table td:nth-child(13){min-width:90px;white-space:nowrap;font-weight:800}
.cdr-summary{font-size:13.5px;gap:14px}

/* Forms and entity pages expand into free horizontal space. */
.b04-form,.h7-global-settings-form{
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr))!important;
  width:100%;
}
.b04-form label.full,.h7-global-settings-form>.full,
.h7-global-settings-form>.h6-inline-fields,.h7-global-settings-form>.b04-actions{grid-column:1/-1!important}
.h6-load-grid,.h6-portal-grid,.h11-quality-grid{
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr))!important;
}
.h10-limit-grid,.h10-select-grid{grid-template-columns:repeat(auto-fit,minmax(270px,1fr))!important}
.b04-modal-card{width:min(1120px,97vw)}
.entity-modal{width:min(720px,96vw)}

/* Avoid cramped header controls on medium-width displays. */
@media(max-width:1450px){
  .search{display:none}
  #revtek-live-clock.h11-clock{min-width:155px}
  .cdr-filter-grid{grid-template-columns:repeat(3,minmax(210px,1fr))!important}
}
@media(max-width:1100px){
  main{width:calc(100% - 252px)}
  #view{padding:18px 14px 38px}
  .cdr-filter-grid{grid-template-columns:repeat(2,minmax(210px,1fr))!important}
  .cdr-filter-grid .cdr-search-field{grid-column:1/-1}
}
@media(max-width:720px){
  main{width:100%}
  #view{padding:14px}
  .cdr-filter-grid{grid-template-columns:1fr!important}
  .cdr-filter-grid .cdr-search-field{grid-column:auto}
  .revtek-date-control{grid-template-columns:1fr auto}
  .revtek-date-control input[type="datetime-local"],.revtek-date-control input[type="date"],.revtek-date-control input[type="time"]{min-width:0!important}
  .live-table table,.cdr-table table{min-width:1250px!important}
}
