/* ============================================================
 * RIMETAL CRM — Raynet-inspired theme overlay pro Twenty
 * ============================================================
 *
 * Inject do twenty-front přes:
 * 1. docker exec -it twenty-front sh
 * 2. cat > /usr/share/nginx/html/rimetal-theme.css (paste this)
 * 3. Edit /usr/share/nginx/html/index.html — přidat <link> tag před </head>:
 *    <link rel="stylesheet" href="/rimetal-theme.css">
 * 4. Reload Twenty UI (Ctrl+Shift+R)
 *
 * ALTERNATIVA — Cloudflare Worker / nginx reverse proxy injection:
 * sub_filter '</head>' '<link rel="stylesheet" href="/rimetal-theme.css"></head>';
 * ============================================================ */

:root {
  /* RIMETAL brand colors — modrá+zelená gradient */
  --rimetal-primary: #1a73e8;        /* RIMETAL modrá */
  --rimetal-primary-hover: #1557b0;
  --rimetal-success: #3fb950;        /* RIMETAL zelená (peníze, úspěch) */
  --rimetal-warning: #f59e0b;        /* žlutá (poznámky) */
  --rimetal-danger: #ef4444;         /* červená (po splatnosti) */
  --rimetal-info: #4ec3e0;           /* světlá tyrkysová */

  /* Raynet-like background palette */
  --raynet-page-bg: #f5f7fa;         /* světle šedá pozadí stránky */
  --raynet-card-bg: #ffffff;         /* bílé karty */
  --raynet-table-row-hover: #fffde7; /* světle žluté row hover */
  --raynet-note-bg: #fff8dc;         /* žluté Poznámka boxy */
  --raynet-note-border: #f59e0b;
  --raynet-status-active: #3fb950;
  --raynet-status-inactive: #94a3b8;
}

/* === TĚLO STRÁNKY — Raynet šedé pozadí === */
body, .app-container, [data-app-root] {
  background: var(--raynet-page-bg) !important;
}

/* === SIDEBAR — RIMETAL gradient na top === */
nav[role="navigation"], aside.sidebar, [data-sidebar] {
  background: linear-gradient(180deg, #ffffff 0%, #f8f9fa 100%) !important;
  border-right: 1px solid #e1e4e8 !important;
}

/* RIMETAL logo strip nahoře v sidebaru */
nav[role="navigation"]::before {
  content: "";
  display: block;
  height: 4px;
  background: linear-gradient(90deg, var(--rimetal-primary) 0%, var(--rimetal-success) 100%);
  margin-bottom: 12px;
}

/* === KARTY — bílé s jemným stínem (Raynet style) === */
.card, .panel, [class*="Card_"], [data-card] {
  background: var(--raynet-card-bg) !important;
  border: 1px solid #e1e4e8 !important;
  border-radius: 8px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
}

/* === POZNÁMKA — žluté boxy jako Raynet === */
[data-field-name="poznamka"], [data-field-name="notice"],
.note-box, [class*="Note_"] {
  background: var(--raynet-note-bg) !important;
  border-left: 4px solid var(--raynet-note-border) !important;
  padding: 12px !important;
  border-radius: 4px !important;
}

/* === TABULKY — kompaktnější Raynet-style === */
table, [role="grid"], [data-table] {
  font-size: 13px !important;
}

table tbody tr:hover, [role="row"]:hover {
  background: var(--raynet-table-row-hover) !important;
}

table th, [role="columnheader"] {
  background: #f5f7fa !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  color: #475569 !important;
}

/* === STATUS DOTS — Raynet zelené/oranžové/červené tečky === */
.status-active, [data-status="UHRAZENA"], [data-status="ACCEPTED"], [data-status="ZAJEM"], [data-status="DORUCENO"] {
  color: var(--raynet-status-active) !important;
}
.status-pending, [data-status="ODESLANA"], [data-status="VYSTAVENA"], [data-status="CEKA"] {
  color: var(--rimetal-warning) !important;
}
.status-overdue, [data-status="PO_SPLATNOSTI"], [data-status="REJECTED"], [data-status="NEZAJEM"] {
  color: var(--rimetal-danger) !important;
}

/* Status badge s tečkou před textem */
[class*="status-badge"]::before, [class*="StatusChip_"]::before {
  content: "●";
  margin-right: 6px;
  font-size: 14px;
}

/* === BUTTONS — RIMETAL primary === */
button[type="submit"], .btn-primary, [data-button-primary] {
  background: var(--rimetal-primary) !important;
  border-color: var(--rimetal-primary) !important;
}
button[type="submit"]:hover, .btn-primary:hover {
  background: var(--rimetal-primary-hover) !important;
}

/* === HEADER WORKSPACE NAME — RIMETAL gradient === */
header [class*="WorkspaceName"], [data-workspace-name] {
  background: linear-gradient(90deg, var(--rimetal-primary), var(--rimetal-success));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 800;
}

/* === KANBAN COLUMNS — Raynet style barevné hlavičky === */
[class*="KanbanColumn_"], [data-kanban-column] {
  background: var(--raynet-card-bg) !important;
  border-top: 4px solid var(--rimetal-primary) !important;
}

/* === DETAIL PANEL — kompaktnější Raynet layout === */
[class*="DetailPanel_"], [data-detail] {
  padding: 16px !important;
}

[class*="DetailPanel_"] dt, [data-detail-label] {
  font-size: 11px !important;
  text-transform: uppercase;
  color: #64748b !important;
  letter-spacing: 0.5px;
  margin-bottom: 4px;
}

/* === AVATARY — Raynet ladí kruhové === */
[class*="Avatar_"], [data-avatar] {
  border-radius: 50% !important;
  border: 2px solid var(--rimetal-primary) !important;
}

/* === TABS — Raynet style underline === */
[role="tablist"] [role="tab"][aria-selected="true"] {
  border-bottom: 3px solid var(--rimetal-primary) !important;
  color: var(--rimetal-primary) !important;
  font-weight: 600 !important;
}

/* === SEARCH BAR — RIMETAL accent === */
input[type="search"], [role="searchbox"] {
  border: 1px solid #d1d5db !important;
  border-radius: 6px !important;
}
input[type="search"]:focus, [role="searchbox"]:focus {
  border-color: var(--rimetal-primary) !important;
  box-shadow: 0 0 0 3px rgba(26, 115, 232, 0.1) !important;
}

/* === DASHBOARD WIDGETY — Raynet style boxy === */
[class*="Widget_"], [data-widget] {
  background: var(--raynet-card-bg) !important;
  border: 1px solid #e1e4e8 !important;
  border-radius: 8px !important;
  padding: 16px !important;
}

[class*="Widget_"] h3, [data-widget-title] {
  font-size: 12px !important;
  text-transform: uppercase;
  color: #64748b !important;
  letter-spacing: 0.5px;
  margin-bottom: 8px !important;
}

/* === FOOTER AGREGACE — Raynet style sticky bottom === */
[class*="Footer_"], [data-footer] {
  position: sticky;
  bottom: 0;
  background: linear-gradient(180deg, transparent 0%, #f5f7fa 30%) !important;
  border-top: 2px solid var(--rimetal-primary) !important;
  font-weight: 600 !important;
  padding: 12px 16px !important;
}

/* === PŘÍZNAKY priorit (high/normal/low) === */
[data-priority="high"], .priority-high { color: var(--rimetal-danger) !important; }
[data-priority="normal"], .priority-normal { color: var(--rimetal-info) !important; }
[data-priority="low"], .priority-low { color: var(--raynet-status-inactive) !important; }

/* === SCROLLBAR — Raynet jemný === */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #f5f7fa; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--rimetal-primary); }

/* === RIMETAL "Made for schools" badge ve workspace footeru === */
nav[role="navigation"]::after {
  content: "🏫 RIMETAL — pro české školy";
  display: block;
  position: absolute;
  bottom: 12px;
  left: 16px;
  font-size: 10px;
  color: #94a3b8;
  letter-spacing: 0.3px;
}
