/* RINGER intranet – skupni slog (tokeni iz grafične podobe RINGER) */
:root {
  --r-bg:#FFFFFF; --r-surface:#F7F5F5; --r-surface-2:#EFEBEB; --r-line:#E3DDDD; --r-line-strong:#CFC7C7;
  --r-ink:#222222; --r-ink-2:#666666; --r-ink-3:#8A8586;
  --r-red:#DB091A; --r-red-strong:#B00714; --r-red-soft:#FDECEE; --r-fill:#DB091A; --r-on-fill:#FFFFFF;
  --r-ok:#1E7B34; --r-warn:#B26A00; --r-danger:#A00E19;
  --r-logo-ink:#DB091A; --r-logo-plate:transparent;
  --r-radius:4px; --r-radius-0:0; --r-gap:8px; --r-maxw:1080px; --r-shadow:0 1px 2px rgba(34,34,34,.06);
  --r-font:"Montserrat","Segoe UI",system-ui,-apple-system,Arial,sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --r-bg:#1A1718; --r-surface:#232022; --r-surface-2:#2C2829; --r-line:#3A3536; --r-line-strong:#4A4445;
    --r-ink:#F2F0F0; --r-ink-2:#A9A3A4; --r-ink-3:#8E8889;
    --r-red:#FF5A63; --r-red-strong:#FF8189; --r-red-soft:#2E1C1E;
    --r-ok:#4ADE80; --r-warn:#F5B33C; --r-danger:#FF6B75;
    --r-logo-ink:#FFFFFF; --r-logo-plate:#DB091A; --r-shadow:0 1px 2px rgba(0,0,0,.5);
  }
}
:root[data-theme="dark"] {
  --r-bg:#1A1718; --r-surface:#232022; --r-surface-2:#2C2829; --r-line:#3A3536; --r-line-strong:#4A4445;
  --r-ink:#F2F0F0; --r-ink-2:#A9A3A4; --r-ink-3:#8E8889;
  --r-red:#FF5A63; --r-red-strong:#FF8189; --r-red-soft:#2E1C1E;
  --r-ok:#4ADE80; --r-warn:#F5B33C; --r-danger:#FF6B75;
  --r-logo-ink:#FFFFFF; --r-logo-plate:#DB091A; --r-shadow:0 1px 2px rgba(0,0,0,.5);
}

* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--r-bg); color:var(--r-ink); font-family:var(--r-font); font-size:16px; line-height:1.65; -webkit-font-smoothing:antialiased; }
.r-wrap { max-width:var(--r-maxw); margin-inline:auto; padding:0 24px; }
@media (max-width:600px){ .r-wrap{ padding:0 16px; } }
h1,h2,h3 { text-wrap:balance; margin:0; }
a { color:var(--r-red); }
:focus-visible { outline:2px solid var(--r-red); outline-offset:2px; }
@media (prefers-reduced-motion: reduce){ *{ animation:none!important; transition:none!important; } }
.hidden { display:none !important; }

/* logotip */
.r-logo { display:inline-flex; align-items:center; gap:10px; text-decoration:none; color:var(--r-logo-ink); background:var(--r-logo-plate); padding:7px 11px; margin:-7px -11px; }
.r-logo-type { display:flex; flex-direction:column; line-height:1; }
.r-logo-type strong { font-size:21px; font-weight:800; letter-spacing:.06em; }
.r-logo-type em { font-style:normal; font-size:9px; font-weight:600; letter-spacing:.24em; margin-top:4px; opacity:.82; }
.r-logo--on-red { color:#fff; background:transparent; }

/* glava */
.r-head { border-bottom:1px solid var(--r-line); background:var(--r-bg); position:sticky; top:0; z-index:5; }
.r-head-in { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:72px; flex-wrap:wrap; }
.r-nav { display:flex; gap:22px; align-items:center; flex-wrap:wrap; }
.r-nav a, .r-nav button.linklike { color:var(--r-ink-2); text-decoration:none; font-size:14px; font-weight:600; padding:6px 0; border:0; border-bottom:2px solid transparent; background:none; font-family:inherit; cursor:pointer; }
.r-nav a:hover, .r-nav a[aria-current="page"], .r-nav button.linklike:hover { color:var(--r-ink); border-bottom-color:var(--r-red); }
.r-user { font-size:13px; color:var(--r-ink-2); }
.r-user strong { color:var(--r-ink); font-weight:600; }

/* tipografija */
.r-eyebrow { font-size:12px; font-weight:700; letter-spacing:.10em; text-transform:uppercase; color:var(--r-red); margin:0 0 14px; }
.r-titleblock { display:flex; flex-direction:column; align-items:flex-start; gap:4px; font-size:clamp(26px,4.4vw,40px); font-weight:800; letter-spacing:-.015em; line-height:1.1; margin:0; }
.r-titleblock span { background:var(--r-fill); color:var(--r-on-fill); padding:.28em .6em; }
.r-lead { font-size:20px; font-weight:300; line-height:1.5; color:var(--r-ink-2); max-width:60ch; margin:22px 0 0; }
.r-h2 { font-size:26px; font-weight:700; letter-spacing:-.01em; color:var(--r-red); margin:48px 0 16px; }
.r-h2::after { content:""; display:block; width:48px; height:3px; background:var(--r-fill); margin-top:10px; }
.r-h3 { font-size:18px; font-weight:700; margin:28px 0 10px; }
.r-muted { color:var(--r-ink-2); font-size:14px; }
.r-small { font-size:13px; }

/* kartice */
.r-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; }
.r-card { background:var(--r-surface); border:1px solid var(--r-line); border-left:3px solid var(--r-fill); border-radius:var(--r-radius); padding:18px 20px; display:flex; flex-direction:column; gap:8px; text-decoration:none; color:inherit; transition:background .15s; }
.r-card:hover { background:var(--r-surface-2); }
.r-card h3 { font-size:16px; font-weight:700; line-height:1.3; }
.r-card p { font-size:14px; color:var(--r-ink-2); margin:0; flex:1; }
.r-card .meta { font-size:12px; color:var(--r-ink-3); display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; }
.r-tag { display:inline-block; font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; padding:2px 7px; border:1px solid var(--r-line-strong); border-radius:var(--r-radius); color:var(--r-ink-2); margin-right:4px; }
.r-tag.on { border-color:var(--r-red); color:var(--r-red); background:var(--r-red-soft); }

/* gumbi in obrazci */
.r-btn { display:inline-flex; align-items:center; gap:8px; background:var(--r-fill); color:var(--r-on-fill); border:0; border-radius:var(--r-radius-0); padding:11px 20px; font:600 14px/1 var(--r-font); letter-spacing:.04em; text-transform:uppercase; cursor:pointer; text-decoration:none; }
.r-btn:hover { background:var(--r-red-strong); }
.r-btn.ghost { background:transparent; color:var(--r-ink); border:1px solid var(--r-line-strong); }
.r-btn.ghost:hover { border-color:var(--r-red); color:var(--r-red); background:transparent; }
.r-btn.sm { padding:7px 12px; font-size:12px; }
.r-btn.danger { background:transparent; color:var(--r-danger); border:1px solid var(--r-danger); }
.r-btn.danger:hover { background:var(--r-danger); color:#fff; }
.r-field { display:flex; flex-direction:column; gap:6px; margin-bottom:16px; }
.r-field label { font-size:12px; font-weight:600; color:var(--r-ink-2); letter-spacing:.02em; }
.r-field input, .r-field select, .r-field textarea { font:400 15px/1.4 var(--r-font); color:var(--r-ink); background:var(--r-bg); border:1px solid var(--r-line-strong); border-radius:var(--r-radius); padding:10px 12px; width:100%; }
.r-field input:focus, .r-field select:focus, .r-field textarea:focus { border-color:var(--r-red); outline:none; }
.r-field textarea { min-height:70px; resize:vertical; }
.r-check { display:inline-flex; align-items:center; gap:6px; font-size:13px; margin:0 12px 6px 0; cursor:pointer; }
.r-check input { accent-color:var(--r-red); width:16px; height:16px; }

/* opozorila */
.r-alert { border-left:3px solid var(--r-fill); background:var(--r-red-soft); padding:12px 16px; font-size:14px; margin:16px 0; }
.r-alert.warn { border-left-color:var(--r-warn); background:var(--r-surface); }
.r-alert.ok { border-left-color:var(--r-ok); background:var(--r-surface); }

/* tabele */
.r-table-wrap { overflow-x:auto; border:1px solid var(--r-line); border-radius:var(--r-radius); }
table.r-table { width:100%; border-collapse:collapse; font-size:14px; }
.r-table th { background:var(--r-fill); color:var(--r-on-fill); text-align:left; font-weight:600; padding:10px 12px; font-size:12px; letter-spacing:.04em; text-transform:uppercase; white-space:nowrap; }
.r-table td { padding:9px 12px; border-top:1px solid var(--r-line); vertical-align:top; }
.r-table tr:nth-child(even) td { background:var(--r-surface); }
.r-table td.num { font-variant-numeric:tabular-nums; text-align:right; }
.r-table .yes { color:var(--r-ok); font-weight:700; }
.r-table .no { color:var(--r-ink-3); }

/* noga */
.r-foot { margin-top:72px; background:var(--r-fill); color:var(--r-on-fill); clip-path:polygon(0 18%,100% 0,100% 100%,0 100%); padding:56px 0 28px; }
.r-foot-in { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap; }
.r-claim { font-size:34px; font-weight:800; line-height:.95; text-transform:uppercase; letter-spacing:-.01em; }
.r-foot small { font-size:12px; opacity:.85; display:block; margin-top:8px; }

/* prijava */
.login-wrap { min-height:100vh; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.login-side { background:var(--r-fill); color:var(--r-on-fill); padding:48px 40px; display:flex; flex-direction:column; justify-content:space-between; }
.login-side .r-claim { font-size:clamp(40px,6vw,72px); }
.login-form { padding:48px 40px; display:flex; align-items:center; justify-content:center; }
.login-form form { width:100%; max-width:380px; }
@media (max-width:760px){ .login-wrap{ grid-template-columns:1fr; } .login-side{ padding:28px 24px; } .login-side .r-claim{ font-size:36px; } .login-form{ padding:32px 16px; } }

/* iskanje */
.r-toolbar { display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin:24px 0 8px; }
.r-toolbar input[type=search] { flex:1; min-width:220px; font:400 15px var(--r-font); padding:10px 12px; border:1px solid var(--r-line-strong); border-radius:var(--r-radius); background:var(--r-bg); color:var(--r-ink); }
.r-toolbar input:focus { border-color:var(--r-red); outline:none; }
