/* luma-ui-light.css — Soft Card Light theme (with high-contrast form controls) */

/* ----- Theme tokens ----- */
html.softcard, body.softcard{
  --bg:#F6F8FB;
  --card:#FFFFFF;
  --border:#E5EAF0;
  --text:#0B1220;
  --muted:#435464;
  --accent:#12B3B3;
  --accent-hover:#0FA3A3;
  --shadow:0 4px 12px rgba(0,0,0,.06);
  --shadow-hover:0 10px 24px rgba(0,0,0,.08);
  --radius-card:16px;
  --radius-btn:12px;
  --space-1:8px; --space-2:12px; --space-3:16px; --space-4:24px;
  --fs-1:34px; --fs-2:26px; --fs-3:20px; --fs-4:16px; --fs-5:14px;
}

html.softcard, body.softcard{ background:var(--bg); color:var(--text); font-family:system-ui,-apple-system,Segoe UI,Inter,Roboto,Arial,sans-serif; line-height:1.6; }

/* Links */
.softcard a{ color:var(--accent); text-decoration:none; }
.softcard a:hover{ color:var(--accent-hover); text-decoration:underline; }

/* Containers */
.softcard .container{ max-width:1200px; margin:0 auto; padding:var(--space-4); }
.softcard .muted{ color:var(--muted); }
.softcard .small{ font-size:var(--fs-5); }

/* Grid helper */
.softcard .grid{ display:grid; grid-template-columns:1fr; gap:var(--space-3); }
@media(min-width:700px){ .softcard .grid{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px){ .softcard .grid{ grid-template-columns:repeat(3,1fr); } }

/* Cards/Tiles */
.softcard .tile.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius-card);
  padding:var(--space-3);
  box-shadow:var(--shadow);
  transition:box-shadow .15s ease, transform .08s ease, border-color .15s ease;
  color:var(--text);
  display:block;
}
.softcard .tile.card:hover{ box-shadow:var(--shadow-hover); transform:translateY(-1px); }
.softcard .tile.card:focus-visible{ outline:3px solid var(--accent); outline-offset:2px; }
.softcard .tile.card h2, .softcard .tile.card h3{ color:var(--text); font-size:var(--fs-3); margin:0 0 var(--space-2); line-height:1.3; }
.softcard .tile.card .caption{ color:var(--muted); font-size:var(--fs-5); }

/* Buttons */
.softcard .btn{ display:inline-block; padding:10px var(--space-4); border-radius:var(--radius-btn); border:1px solid var(--border); cursor:pointer; text-align:center; font-weight:600; }
.softcard .btn.primary{ background:var(--accent); color:white; border-color:transparent; }
.softcard .btn.primary:hover{ background:var(--accent-hover); }
.softcard .btn.secondary{ background:#fff; color:var(--text); }
.softcard .btn:focus-visible{ outline:3px solid var(--accent); outline-offset:2px; }

/* Tabs/Chips */
.softcard .tabs{ display:flex; gap:var(--space-2); flex-wrap:wrap; background:#fff; border:1px solid var(--border); padding:6px; border-radius:999px; box-shadow:var(--shadow); }
.softcard .tabs .tab{ padding:8px 12px; border-radius:999px; color:var(--muted); font-weight:600; }
.softcard .tabs .tab[aria-selected="true"], .softcard .tabs .tab.is-active{ background:var(--accent); color:#fff; }

/* Breadcrumbs */
.softcard .breadcrumbs{ display:flex; gap:var(--space-2); white-space:nowrap; overflow-x:auto; padding:var(--space-2) 0; -webkit-overflow-scrolling:touch; }
.softcard .breadcrumbs a{ color:var(--muted); }
.softcard .breadcrumbs .current{ color:var(--text); font-weight:600; }

/* Status pill */
.softcard .pill{ display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:999px; font-size:var(--fs-5); border:1px solid var(--border); background:#fff; color:var(--muted); }
.softcard .pill.success{ color:#0f5132; background:#d1e7dd; border-color:#badbcc; }
.softcard .pill.warn{ color:#664d03; background:#fff3cd; border-color:#ffecb5; }
.softcard .pill.info{ color:#055160; background:#cff4fc; border-color:#b6effb; }

/* Headings */
.softcard h1{ font-size:var(--fs-1); line-height:1.15; margin:0 0 var(--space-3); color:var(--text); }
.softcard h2{ font-size:var(--fs-2); line-height:1.2; margin:0 0 var(--space-2); color:var(--text); }

/* Tables */
.softcard table{ width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--border); border-radius:var(--radius-card); overflow:hidden; box-shadow:var(--shadow); }
.softcard th, .softcard td{ padding:12px var(--space-3); border-bottom:1px solid var(--border); color:var(--text); }
.softcard th{ text-align:left; font-weight:600; background:#FAFBFE; }
.softcard tr:last-child td{ border-bottom:none; }

/* Utilities */
.softcard .row{ display:flex; gap:var(--space-3); flex-wrap:wrap; }
.softcard .right{ margin-left:auto; }
.softcard .center{ text-align:center; }
.softcard .hidden{ display:none !important; }

/* Mobile spacing fix */
@media(max-width:520px){
  .softcard .tile.card{ padding:var(--space-2); }
  .softcard .btn{ width:100%; }
}

/* ----- Hub variant ----- */
html.softcard.hub main, body.softcard.hub main{
  display:grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--space-3);
}
html.softcard.hub main a[href]:has(h2), body.softcard.hub main a[href]:has(h2),
html.softcard.hub main a[href]:has(h3), body.softcard.hub main a[href]:has(h3){
  background:var(--card); border:1px solid var(--border); border-radius:16px; padding:var(--space-3);
  box-shadow:var(--shadow); transition:box-shadow .15s ease, transform .08s ease, border-color .15s ease; color:var(--text); display:block;
}
html.softcard.hub main a[href]:has(h2):hover, html.softcard.hub main a[href]:has(h3):hover{ box-shadow:var(--shadow-hover); transform:translateY(-1px); }
html.softcard.hub main a[href]:has(h2):focus-visible, html.softcard.hub main a[href]:has(h3):focus-visible{ outline:3px solid var(--accent); outline-offset:2px; }
html.softcard.hub main a[href]:has(h2) h2, html.softcard.hub main a[href]:has(h3) h3{ color:var(--text); font-size:var(--fs-3); margin:0 0 var(--space-2); line-height:1.3; }
html.softcard.hub main a[href]:has(h2) p:first-of-type, html.softcard.hub main a[href]:has(h3) p:first-of-type{ color:var(--muted); font-size:var(--fs-5); margin:0; }
html.softcard.hub main p a, html.softcard.hub main li a{ display:inline; background:none; border:none; box-shadow:none; padding:0; }

/* ===== High-contrast form controls ===== */
.softcard label{ color:var(--text); font-weight:600; display:block; margin-bottom:6px; }
.softcard .form-group, .softcard .field{ margin-bottom:12px; }

.softcard input[type="text"],
.softcard input[type="email"],
.softcard input[type="password"],
.softcard input[type="search"],
.softcard input[type="number"],
.softcard input[type="url"],
.softcard input[type="tel"],
.softcard textarea,
.softcard select{
  background:#FFFFFF;
  color:var(--text);
  border:1px solid #D5DDE5;
  border-radius:12px;
  padding:12px 14px;
  box-shadow:var(--shadow);
  width:100%;
  transition:border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}

.softcard input::placeholder,
.softcard textarea::placeholder{ color:#7A8A99; opacity:1; }

.softcard input:focus-visible,
.softcard textarea:focus-visible,
.softcard select:focus-visible{
  outline:3px solid var(--accent);
  outline-offset:2px;
  border-color:var(--accent);
  box-shadow:0 0 0 1px var(--accent), var(--shadow);
}

.softcard input:disabled,
.softcard textarea:disabled,
.softcard select:disabled{
  background:#F0F3F8;
  color:#9AA9B6;
  cursor:not-allowed;
}

.softcard input:invalid,
.softcard textarea:invalid,
.softcard select:invalid{
  border-color:#E03131;
  box-shadow:0 0 0 1px rgba(224,49,49,.35);
}

.softcard .help, .softcard .hint{ color:var(--muted); font-size:var(--fs-5); margin-top:6px; }

/* Ensure inputs inside cards stay white */
.softcard .tile.card input,
.softcard .tile.card textarea,
.softcard .tile.card select{ background:#FFFFFF; }