/*
 * RegionsTurneringen Holdtilmelding – Frontend UI
 * Dark/Gold theme (scoped 100% to .rt-ui)
 */

.rt-ui{
  --rt-gold:#9a7e10;
  --rt-bg:#070708;
  --rt-card:#0f0f12;
  --rt-card2:#0b0b0e;
  --rt-text:#ffffff;
  --rt-muted:rgba(255,255,255,.65);

  /* Gold alphas (the “look”) */
  --rt-border:rgba(154,126,16,.35);
  --rt-border-strong:rgba(154,126,16,.55);
  --rt-divider-strong:rgba(154,126,16,.25);
  --rt-divider:rgba(154,126,16,.22);
  --rt-divider-soft:rgba(154,126,16,.16);
  --rt-head-bg:rgba(154,126,16,.10);
  --rt-hover-bg:rgba(154,126,16,.06);
  --rt-glow:rgba(154,126,16,.14);
  --rt-glow-soft:rgba(154,126,16,.12);

  color:var(--rt-text);
}

.rt-ui,
.rt-ui *{
  box-sizing:border-box;
}

.rt-ui.rt-holdtilmelding-wrapper{
  background:var(--rt-bg);
  border-radius:18px;
  padding:18px;
}

.rt-ui .rt-container{
  max-width:1100px;
  margin:0 auto;
}

/* ---------- Cards (core of the theme) ---------- */
.rt-ui .rt-card{
  border-radius:18px;
  border:1px solid var(--rt-border);
  box-shadow:0 12px 35px rgba(0,0,0,.45);
  background:
    radial-gradient(120% 120% at 50% 20%, var(--rt-glow), rgba(0,0,0,0)),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(0,0,0,0));
  background-color:var(--rt-card);
  padding:18px;
}

.rt-ui .rt-card2{
  border-radius:14px;
  border:1px solid var(--rt-divider);
  background:
    radial-gradient(120% 120% at 50% 20%, rgba(154,126,16,.10), rgba(0,0,0,0)),
    linear-gradient(180deg, rgba(154,126,16,.08), rgba(0,0,0,0));
  background-color:var(--rt-card2);
  padding:14px;
}

.rt-ui .rt-card--modal{
  box-shadow:0 22px 70px rgba(0,0,0,.55);
}

/* ---------- Typography ---------- */
.rt-ui .rt-title,
.rt-ui .rt-holdtilmelding-heading{
  margin:0 0 14px 0;
  color:var(--rt-gold);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.4px;
  font-size:18px;
}

.rt-ui .rt-muted{
  color:var(--rt-muted);
}

.rt-ui .rt-holdtilmelding-message{
  margin:0;
  color:var(--rt-muted);
}

/* ---------- Notices ---------- */
.rt-ui .rt-holdtilmelding-notice{
  border-radius:12px;
  border:1px solid var(--rt-border);
  background:var(--rt-hover-bg);
  padding:10px 12px;
  margin:10px 0;
  color:var(--rt-text);
}

.rt-ui .rt-holdtilmelding-notice-error{
  border-color:rgba(255,90,90,.35);
  background:rgba(255,90,90,.08);
}

/* ---------- Form layout ---------- */
.rt-ui .rt-holdtilmelding-form{
  margin-top:12px;
}

.rt-ui .rt-holdtilmelding-rows{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.rt-ui .rt-holdtilmelding-row{
  position:relative;
}

.rt-ui .rt-holdtilmelding-row:hover{
  background-color:var(--rt-hover-bg);
}

/* Lines: keep the 3-field / 3-field layout on desktop */
.rt-ui .rt-holdtilmelding-line{
  display:grid;
  gap:12px;
}

.rt-ui .rt-line-top{
  /* Auto-wrap uden overflow på smalle content-containere */
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.rt-ui .rt-line-bottom{
  /* Auto-wrap + plads til actions uden at skubbe layout ud over kanten */
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  align-items:end;
}

/* Desktop: gør "Række" og "Telefon" smallere så felterne passer i kortet */
@media (min-width: 920px){
  .rt-ui .rt-line-top{
    grid-template-columns: 1.35fr 0.7fr 1.35fr !important;
  }
  .rt-ui .rt-line-bottom{
    grid-template-columns: 1.35fr 0.7fr 1.35fr !important;
  }
}

/* Tillad grid-items at krympe (vigtigt for lange select-tekster) */
.rt-ui .rt-holdtilmelding-line > .rt-field{ min-width:0; }

/* Actions-knapper under linjen (undgår overlap/overflow på smalle bredder) */
.rt-ui .rt-holdtilmelding-actions{
  grid-column: 1 / -1;
  display:flex;
  justify-content:flex-end;
  gap:8px;
}

.rt-ui .rt-holdtilmelding-line + .rt-holdtilmelding-line{
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid var(--rt-divider-soft);
}

.rt-ui .rt-field{
  min-width:0;
}

.rt-ui .rt-field.rt-holdtilmelding-actions{
  min-width:0;
  display:flex;
  align-items:flex-end;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-start;
}

.rt-ui .rt-field.rt-holdtilmelding-actions .rt-btn{
  white-space:nowrap;
}

.rt-ui .rt-field label{
  display:block;
  margin:0 0 6px 0;
  color:var(--rt-gold);
  font-weight:700;
  font-size:13px;
  letter-spacing:.2px;
}

/* Inputs/Selects (gold border + black fill) */
.rt-ui .rt-field input[type="text"],
.rt-ui .rt-field input[type="tel"],
.rt-ui .rt-field input[type="email"],
.rt-ui .rt-field select{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  background:#000000 !important;
  border:1px solid rgba(154,126,16,.5) !important;
  border-radius:10px;
  padding:10px 12px;
  font-size:14px;
  line-height:1.2;
}

.rt-ui .rt-field input[type="text"],
.rt-ui .rt-field input[type="tel"],
.rt-ui .rt-field input[type="email"]{
  color:var(--rt-text) !important;
}

.rt-ui .rt-field select{
  color:var(--rt-gold) !important;
}

.rt-ui .rt-field select option{
  background:#000000;
  color:var(--rt-text);
}

.rt-ui .rt-field input::placeholder{
  color:rgba(255,255,255,.5);
}

.rt-ui .rt-field input:focus,
.rt-ui .rt-field select:focus{
  border-color:var(--rt-border-strong) !important;
  outline:none;
  box-shadow:0 0 0 3px var(--rt-glow-soft);
}

.rt-ui .rt-field input[readonly]{
  opacity:.92;
}

/* ---------- Controls container (over inputs / actions) ---------- */
.rt-ui .rt-controls{
  border-radius:14px;
  border:1px solid var(--rt-border);
  background:linear-gradient(180deg, rgba(154,126,16,.15), rgba(0,0,0,0));
  padding:14px;
  gap:12px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  margin-top:14px;
}

/* Completed state */
.rt-ui .rt-holdtilmelding-reopen-form{
  justify-content:center;
}

/* ---------- Buttons ---------- */
.rt-ui .rt-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  cursor:pointer;
  border-radius:12px;
  padding:10px 14px;
  font-weight:800;
  font-size:14px;
  line-height:1;
  letter-spacing:.2px;
  text-decoration:none;
  user-select:none;
  border:1px solid transparent;
  background:transparent;
  transition:filter .15s ease, box-shadow .15s ease, background-color .15s ease, border-color .15s ease;
}

.rt-ui .rt-btn--primary{
  background:var(--rt-gold);
  color:#000000;
}

.rt-ui .rt-btn--primary:hover{
  filter:brightness(.92);
  box-shadow:0 0 0 3px var(--rt-glow-soft);
}

.rt-ui .rt-btn--outline{
  background:transparent;
  color:var(--rt-text);
  border-color:var(--rt-border-strong);
}

.rt-ui .rt-btn--outline:hover{
  background:var(--rt-hover-bg);
}

.rt-ui .rt-btn:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px var(--rt-glow-soft);
}

/* ---------- Modal ---------- */
.rt-ui .rt-holdtilmelding-modal-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.75);
  display:none;
  align-items:center;
  justify-content:center;
  padding:16px;
  z-index:9999;
  backdrop-filter:blur(2px);
}

.rt-ui .rt-holdtilmelding-modal{
  width:min(92vw, 720px);
  max-height:72vh;
  overflow:auto;
  position:relative;
}

.rt-ui .rt-holdtilmelding-modal-title{
  margin:0 0 14px 0;
  color:var(--rt-gold);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.4px;
  font-size:16px;
}

.rt-ui .rt-holdtilmelding-modal-close{
  position:absolute;
  top:12px;
  right:12px;
  width:40px;
  height:40px;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
}

/* ---------- Tables (modal) ---------- */
.rt-ui .rt-holdtilmelding-modal-table-wrap{
  border-radius:12px;
  overflow:hidden;
  border:1px solid var(--rt-divider);
}

.rt-ui .rt-holdtilmelding-spiller-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  font-size:13px;
}

.rt-ui .rt-holdtilmelding-spiller-table thead th{
  background:var(--rt-head-bg);
  color:var(--rt-gold);
  font-size:12px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.35px;
  padding:10px 12px;
  border-bottom:1px solid var(--rt-divider-soft);
  text-align:left;
}

.rt-ui .rt-holdtilmelding-spiller-table tbody td{
  padding:10px 12px;
  color:var(--rt-text);
  border-bottom:1px solid var(--rt-divider-soft);
}

.rt-ui .rt-holdtilmelding-spiller-table tbody tr:hover td{
  background:var(--rt-hover-bg);
}

.rt-ui .rt-holdtilmelding-spiller-table tbody tr:last-child td{
  border-bottom:none;
}

/* ---------- Theme Modal (erstatter browser confirm) ---------- */
.rt-ui .rt-modal-overlay{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  z-index:9999;
  background:
    radial-gradient(120% 120% at 50% 20%, rgba(154,126,16,.15), rgba(0,0,0,0)),
    rgba(0,0,0,.74);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}

.rt-ui .rt-modal-overlay.rt-is-open{
  animation:rtModalFadeIn .12s ease-out;
}

.rt-ui .rt-modal{
  width:min(520px, 100%);
}

.rt-ui .rt-modal-header{
  padding-bottom:10px;
  border-bottom:1px solid var(--rt-divider-soft);
}

.rt-ui .rt-modal-title{
  margin:0;
  color:var(--rt-gold);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.4px;
  font-size:16px;
}

.rt-ui .rt-modal-body{
  padding-top:10px;
}

.rt-ui .rt-modal-text{
  margin:0;
  color:var(--rt-muted);
  font-size:13px;
  line-height:1.45;
}

.rt-ui .rt-modal-actions{
  display:flex;
  gap:10px;
  justify-content:flex-end;
  flex-wrap:wrap;
  margin-top:16px;
}

@keyframes rtModalFadeIn{
  from{ opacity:0; }
  to{ opacity:1; }
}

/* ---------- Responsive ---------- */
@media (max-width: 900px){
  .rt-ui.rt-holdtilmelding-wrapper{ padding:14px; }
  .rt-ui .rt-card{ padding:14px; }
  .rt-ui .rt-card2{ padding:12px; }

  /* 2-column layout: keep fields aligned nicely */
  .rt-ui .rt-line-top{ grid-template-columns: 1fr 1fr; }
  .rt-ui .rt-line-top .rt-field:first-child{ grid-column: 1 / -1; }

  .rt-ui .rt-line-bottom{ grid-template-columns: 1fr 1fr; }
  .rt-ui .rt-line-bottom .rt-field.rt-holdtilmelding-actions{
    grid-column: 1 / -1;
    justify-content:flex-start;
  }
}

@media (max-width: 560px){
  .rt-ui .rt-line-top,
  .rt-ui .rt-line-bottom{
    grid-template-columns: 1fr;
  }

  .rt-ui .rt-line-top .rt-field:first-child{ grid-column:auto; }
  .rt-ui .rt-field.rt-holdtilmelding-actions{ align-items:stretch; }
  .rt-ui .rt-controls{ align-items:stretch; }
  .rt-ui .rt-btn{ width:100%; }
}
/* ===== RT Holdtilmelding: layout fixes (0.9.31) ===== */
.rt-ui .rt-holdtilmelding-row .rt-field{min-width:0;}
.rt-ui .rt-holdtilmelding-row input,
.rt-ui .rt-holdtilmelding-row select{min-width:0;max-width:100%;box-sizing:border-box;}

/* Admin UI (rt-reg-*) – moved from inline styles for stability */
.rt-ui .rt-reg-card{
  background: rgba(0,0,0,.32);
  border: 1px solid rgba(154,126,16,.28);
  border-radius: 18px;
  padding: 16px;
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
}
.rt-ui .rt-reg-card + .rt-reg-card{margin-top:14px;}

.rt-ui .rt-reg-top{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  gap:12px;
  justify-content:space-between;
}
.rt-ui .rt-reg-field{
  display:flex;
  flex-direction:column;
  gap:6px;
  flex: 1 1 220px;
  min-width: 180px;
}

.rt-ui .rt-reg-field--wide{
  flex: 1 1 280px;
}
.rt-ui .rt-reg-field label{font-size:13px;opacity:.9;}
.rt-ui .rt-reg-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-left:auto;
}

.rt-ui .rt-reg-actions--settings{
  flex: 0 0 auto;
  min-width: max-content;
  align-self: flex-end;
}

@media (max-width: 900px){
  .rt-ui .rt-reg-actions--settings{
    width: 100%;
    justify-content: flex-end;
  }
}
.rt-ui .rt-reg-btn{
  background:#9a7e10;
  color:#fff;
  border:0;
  border-radius:12px;
  padding:10px 14px;
  font-weight:800;
  cursor:pointer;
  box-shadow: 0 10px 20px rgba(0,0,0,.25);
}
.rt-ui .rt-reg-btn--ghost{
  background:transparent;
  border:1px solid rgba(154,126,16,.45);
  box-shadow:none;
}
.rt-ui .rt-reg-btn:active{transform: translateY(1px);}

.rt-ui .rt-reg-tablewrap{
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling: touch;
  border-radius:14px;
  border:1px solid rgba(154,126,16,.20);
  max-width:100%;
}
.rt-ui table.rt-reg-table{width:100%;border-collapse:collapse;min-width:980px;background:rgba(0,0,0,.20);}
.rt-ui table.rt-reg-table th,
.rt-ui table.rt-reg-table td{
  padding:10px 10px;
  border-bottom:1px solid rgba(154,126,16,.15);
  vertical-align:middle;
}
.rt-ui table.rt-reg-table th{font-size:12px;letter-spacing:.4px;text-transform:uppercase;opacity:.9;}
.rt-ui table.rt-reg-table tr:hover td{background:rgba(154,126,16,.06);}

@media (max-width: 980px){
  .rt-ui table.rt-reg-table{min-width:860px;}
}