/* ==========================================================================
   Moro Runners Club — Brand Theme
   Palette: Forest/Emerald Green + Gold + Charcoal/Black
   ========================================================================== */
:root{
  --mrc-green:#0f6b3b;      /* primary */
  --mrc-green-dark:#0a4d2a;
  --mrc-green-light:#1c8f52;
  --mrc-gold:#d4a017;       /* accent */
  --mrc-gold-light:#f2c14e;
  --mrc-black:#14181a;
  --mrc-charcoal:#232a2e;
  --mrc-muted:#6c7a72;
  --mrc-bg:#f4f7f5;
  --mrc-sidebar-w:250px;
  --mrc-sidebar-w-collapsed:74px;
  --mrc-radius:.6rem;
  --mrc-shadow:0 2px 10px rgba(15,107,59,.08);
  --mrc-shadow-lg:0 8px 28px rgba(15,107,59,.16);
  --mrc-trans:all .25s cubic-bezier(.4,0,.2,1);
}

*{scrollbar-width:thin;scrollbar-color:var(--mrc-green-light) transparent;}
body{background:var(--mrc-bg);color:var(--mrc-black);font-size:.9rem;}
a{color:var(--mrc-green);text-decoration:none;}
a:hover{color:var(--mrc-green-dark);}

/* ---------- Buttons ---------- */
.btn{border-radius:var(--mrc-radius);font-weight:600;font-size:.85rem;transition:var(--mrc-trans);}
.btn-brand{background:var(--mrc-green);border-color:var(--mrc-green);color:#fff;}
.btn-brand:hover{background:var(--mrc-green-dark);border-color:var(--mrc-green-dark);color:#fff;transform:translateY(-1px);}
.btn-gold{background:var(--mrc-gold);border-color:var(--mrc-gold);color:var(--mrc-black);}
.btn-gold:hover{background:var(--mrc-gold-light);border-color:var(--mrc-gold-light);color:var(--mrc-black);}
.btn-outline-brand{border-color:var(--mrc-green);color:var(--mrc-green);}
.btn-outline-brand:hover{background:var(--mrc-green);color:#fff;}
.text-brand{color:var(--mrc-green)!important;}
.text-gold{color:var(--mrc-gold)!important;}
.bg-brand{background:var(--mrc-green)!important;}
.bg-gold{background:var(--mrc-gold)!important;}

/* ---------- Top loading bar ---------- */
#mrc-loader{position:fixed;top:0;left:0;height:3px;width:0;z-index:2000;
  background:linear-gradient(90deg,var(--mrc-gold),var(--mrc-green-light),var(--mrc-gold));
  box-shadow:0 0 10px var(--mrc-gold);transition:width .3s ease,opacity .4s ease;opacity:0;}
#mrc-loader.active{opacity:1;}

/* ---------- Auth pages (login/register with running bg) ---------- */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem 1rem;position:relative;
  background:
  url('../public/images/20.jpeg') center/cover fixed no-repeat;}
.auth-card{background:rgba(255,255,255,.97);border-radius:1rem;box-shadow:var(--mrc-shadow-lg);
  width:100%;max-width:300px;overflow:hidden;animation:fadeUp .5s ease;}



.auth-cardx{background:rgba(255,255,255,.97);border-radius:1rem;box-shadow:var(--mrc-shadow-lg);
  width:100%;max-width:500px;overflow:hidden;animation:fadeUp .5s ease;}



.auth-card.wide{max-width:300px;}
.auth-head{background:linear-gradient(135deg,var(--mrc-green),var(--mrc-green-dark));color:#fff;padding:1.4rem 1.6rem;text-align:center;}
.auth-head .brand-mark{width:56px;height:56px;border-radius:50%;background:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:1.6rem;color:var(--mrc-black);margin-bottom:.5rem;box-shadow:0 4px 12px rgba(0,0,0,.25);}
.auth-body{padding:0.6rem;}
@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* ---------- Inputs with icons ---------- */
.input-icon{position:relative;}
.input-icon .form-control,.input-icon .form-select{padding-left:2.4rem;}
.input-icon > .bi{position:absolute;left:.85rem;top:50%;transform:translateY(-50%);color:var(--mrc-muted);font-size:1rem;z-index:5;pointer-events:none;}
.form-control,.form-select{border-radius:var(--mrc-radius);font-size:.85rem;padding:.5rem .75rem;border-color:#d8e0da;}
.form-control:focus,.form-select:focus{border-color:var(--mrc-green-light);box-shadow:0 0 0 .18rem rgba(28,143,82,.18);}
.form-control-sm,.form-select-sm{font-size:.8rem;}
.form-label{font-weight:600;font-size:.8rem;margin-bottom:.25rem;color:var(--mrc-charcoal);}
.field-feedback{font-size:.75rem;margin-top:.2rem;display:block;min-height:1rem;}
.is-valid{border-color:#1c8f52!important;}
.is-invalid{border-color:#dc3545!important;}
.valid-note{color:#1c8f52;}
.invalid-note{color:#dc3545;}

/* ==========================================================================
   Admin / Member shell — sidebar + topbar
   ========================================================================== */
.mrc-shell{display:flex;min-height:100vh;}
.mrc-sidebar{width:var(--mrc-sidebar-w);background:linear-gradient(180deg,var(--mrc-black),var(--mrc-charcoal));
  color:#cfe0d6;position:fixed;top:0;left:0;bottom:0;z-index:1030;display:flex;flex-direction:column;transition:var(--mrc-trans);overflow:hidden;}
.mrc-sidebar .side-brand{display:flex;align-items:center;gap:.6rem;padding:1rem 1.1rem;border-bottom:1px solid rgba(255,255,255,.06);white-space:nowrap;}
.mrc-sidebar .side-brand .logo{min-width:38px;height:38px;border-radius:50%;background:var(--mrc-gold);color:var(--mrc-black);display:flex;align-items:center;justify-content:center;font-size:1.15rem;font-weight:800;}
.mrc-sidebar .side-brand span{font-weight:700;color:#fff;font-size:.95rem;}
.side-search{padding:.7rem .8rem;}
.side-search .input-icon .form-control{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);color:#fff;font-size:.8rem;}
.side-search .input-icon .form-control::placeholder{color:#8fa89a;}
.side-search .input-icon > .bi{color:#8fa89a;}
.side-nav{list-style:none;margin:0;padding:.3rem 0;overflow-y:auto;flex:1;}
.side-nav .nav-section{font-size:.65rem;text-transform:uppercase;letter-spacing:.08em;color:#6f8578;padding:.7rem 1.1rem .3rem;white-space:nowrap;}
.side-nav a{display:flex;align-items:center;gap:.75rem;padding:.55rem 1.1rem;color:#bcd0c4;font-size:.83rem;font-weight:500;position:relative;white-space:nowrap;transition:var(--mrc-trans);}
.side-nav a .bi{font-size:1.05rem;min-width:22px;text-align:center;}
.side-nav a:hover{background:rgba(255,255,255,.05);color:#fff;}
.side-nav a.active{background:linear-gradient(90deg,rgba(15,107,59,.55),transparent);color:#fff;}
.side-nav a.active::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--mrc-gold);}
.side-nav a .badge{margin-left:auto;}
.side-foot{padding:.8rem 1.1rem;border-top:1px solid rgba(255,255,255,.06);font-size:.72rem;color:#7f9689;white-space:nowrap;}

.mrc-main{flex:1;margin-left:var(--mrc-sidebar-w);transition:var(--mrc-trans);min-width:0;}
.mrc-topbar{position:sticky;top:0;z-index:1020;background:#fff;box-shadow:var(--mrc-shadow);height:58px;display:flex;align-items:center;gap:1rem;padding:0 1.1rem;}
.mrc-topbar .toggle-btn{background:none;border:none;font-size:1.25rem;color:var(--mrc-green);cursor:pointer;}
.mrc-topbar .page-title{font-weight:700;font-size:1rem;margin:0;color:var(--mrc-charcoal);}
.mrc-content{padding:1.1rem;}

/* collapsed state */
body.side-collapsed .mrc-sidebar{width:var(--mrc-sidebar-w-collapsed);}
body.side-collapsed .mrc-sidebar .side-brand span,
body.side-collapsed .side-search,
body.side-collapsed .side-nav .nav-section,
body.side-collapsed .side-nav a span,
body.side-collapsed .side-foot{opacity:0;visibility:hidden;}
body.side-collapsed .mrc-main{margin-left:var(--mrc-sidebar-w-collapsed);}

/* ---------- Cards / stat tiles ---------- */
.card{border:none;border-radius:var(--mrc-radius);box-shadow:var(--mrc-shadow);}
.card .card-header{background:#fff;border-bottom:1px solid #eef2ef;font-weight:700;font-size:.9rem;padding:.7rem 1rem;}
.stat-tile{border-radius:var(--mrc-radius);padding:1rem 1.1rem;color:#fff;position:relative;overflow:hidden;box-shadow:var(--mrc-shadow);transition:var(--mrc-trans);}
.stat-tile:hover{transform:translateY(-3px);box-shadow:var(--mrc-shadow-lg);}
.stat-tile .bi{position:absolute;right:.6rem;bottom:.2rem;font-size:3.2rem;opacity:.16;}
.stat-tile .val{font-size:1.6rem;font-weight:800;line-height:1;}
.stat-tile .lbl{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;opacity:.9;}
.tile-green{background:linear-gradient(135deg,var(--mrc-green),var(--mrc-green-dark));}
.tile-gold{background:linear-gradient(135deg,var(--mrc-gold),#b8860b);color:var(--mrc-black)!important;}
.tile-dark{background:linear-gradient(135deg,var(--mrc-charcoal),var(--mrc-black));}
.tile-teal{background:linear-gradient(135deg,#12897e,#0a5b54);}

/* ---------- Tables (compact, bordered, responsive) ---------- */
table.dataTable{font-size:.82rem;}
.table-compact th,.table-compact td{padding:.45rem .6rem;vertical-align:middle;}
table.dataTable thead th{background:var(--mrc-green);color:#fff;border-color:var(--mrc-green-dark)!important;font-size:.78rem;text-transform:uppercase;letter-spacing:.03em;}
table.dataTable.table-bordered td,table.dataTable.table-bordered th{border:1px solid #e3ebe6;}
table.dataTable tbody tr:hover{background:#eef7f1;}
.dataTables_wrapper .dataTables_filter input{border:1px solid #d8e0da;border-radius:var(--mrc-radius);padding:.28rem .5rem .28rem 1.9rem;font-size:.8rem;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='%236c7a72' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001q.044.06.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1 1 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0'/%3E%3C/svg%3E") no-repeat .55rem center;}
.dataTables_wrapper .dataTables_filter{text-align:left!important;float:left;}
.dataTables_wrapper .dataTables_length{float:right;font-size:.8rem;}
.dataTables_wrapper .dataTables_paginate{float:left!important;text-align:left!important;padding-top:.6rem;}
.dataTables_wrapper .dataTables_info{font-size:.78rem;color:var(--mrc-muted);padding-top:.7rem;}
.dataTables_wrapper .dataTables_paginate .paginate_button.current{background:var(--mrc-green)!important;border-color:var(--mrc-green)!important;color:#fff!important;border-radius:.35rem;}
.dataTables_wrapper .dataTables_paginate .paginate_button{padding:.2rem .55rem;font-size:.78rem;}
.dt-buttons .btn{font-size:.75rem;padding:.28rem .6rem;margin-right:.25rem;}

/* ---------- Badges / status pills ---------- */
.pill{font-size:.68rem;font-weight:700;padding:.22rem .55rem;border-radius:1rem;text-transform:uppercase;letter-spacing:.03em;}
.pill-approved,.pill-active,.pill-resolved{background:#dff5e8;color:#0f6b3b;}
.pill-pending,.pill-open,.pill-upcoming{background:#fff3d6;color:#8a6d0b;}
.pill-rejected,.pill-banned{background:#fde2e2;color:#c0392b;}
.pill-suspended,.pill-in_review{background:#e6ecff;color:#2d4bbb;}
.pill-past,.pill-cancelled{background:#eceff1;color:#546069;}

/* ---------- Notification modal ---------- */
.notify-icon{width:66px;height:66px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2rem;margin:0 auto 1rem;animation:pop .35s ease;}
.notify-icon.ok{background:#dff5e8;color:#0f6b3b;}
.notify-icon.err{background:#fde2e2;color:#c0392b;}
.notify-icon.warn{background:#fff3d6;color:#8a6d0b;}
@keyframes pop{0%{transform:scale(.4);opacity:0}70%{transform:scale(1.1)}100%{transform:scale(1);opacity:1}}

/* ---------- Landing / home ---------- */
.hero{min-height:88vh;display:flex;align-items:center;color:#fff;position:relative;
  background:linear-gradient(rgba(10,77,42,.78),rgba(20,24,26,.9)),url('../images/running-bg.jpg') center/cover no-repeat;}
.hero .badge-club{background:var(--mrc-gold);color:var(--mrc-black);font-weight:700;padding:.35rem .8rem;border-radius:1rem;font-size:.75rem;}
.navbar-brand-mark{width:34px;height:34px;border-radius:50%;background:var(--mrc-gold);color:var(--mrc-black);display:inline-flex;align-items:center;justify-content:center;font-weight:800;margin-right:.5rem;}
.feature-ico{width:52px;height:52px;border-radius:var(--mrc-radius);background:#dff5e8;color:var(--mrc-green);display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin-bottom:.8rem;}

/* ---------- misc ---------- */
.avatar-sm{width:34px;height:34px;border-radius:50%;object-fit:cover;background:var(--mrc-green-light);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:.8rem;}
.event-thumb{width:100%;height:150px;object-fit:cover;border-radius:var(--mrc-radius) var(--mrc-radius) 0 0;}
.divider-gold{height:3px;width:52px;background:var(--mrc-gold);border-radius:3px;margin:.5rem 0 1rem;}

/* ---------- responsive ---------- */
@media(max-width:991px){
  .mrc-sidebar{transform:translateX(-100%);width:var(--mrc-sidebar-w);}
  body.side-open .mrc-sidebar{transform:translateX(0);}
  .mrc-main{margin-left:0!important;}
  body.side-collapsed .mrc-sidebar{width:var(--mrc-sidebar-w);}
  .side-backdrop{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:1025;}
  body.side-open .side-backdrop{display:block;}
}
