@font-face {
    font-family: 'JosefinSans';
    src: url(../fonts/JosefinSans-VariableFont_wght.ttf) format('truetype');
}

@font-face {
    font-family: 'YesevaOne';
    src: url(../fonts/YesevaOne-Regular.ttf) format('truetype');
}

* {
    font-family: JosefinSans;
    box-sizing: border-box;
}

h1, h2, h3, h4, h5, h6 {
    font-family: YesevaOne !important;
}
/* .rs-navbar-item:focus, .rs-navbar-inverse .rs-navbar-item:hover */
:root {
    --rs-navbar-default-bg: #d29c92!important;
    --rs-navbar-inverse-bg: #d29c92!important;
    --rs-navbar-default-text: black!important;
    --rs-navbar-inverse-text: black!important;
    --rs-navbar-default-hover-bg: white!important;
    --rs-navbar-inverse-hover-bg: white!important;
    --rs-navbar-default-hover-text: #d29c92!important;
    --rs-navbar-inverse-hover-text: #d29c92!important;
    --rs-navbar-default-active-bg: white!important;
    --rs-navbar-inverse-active-bg: white!important;
    --rs-navbar-default-active-text: #d29c92!important;
    --rs-navbar-inverse-active-text: #d29c92!important;
    --rs-btn-primary-bg: #d29c92!important;
    --rs-btn-default-bg: #d29c92!important;
    --rs-btn-primary-hover-bg: #a0756d!important;
    --slowmove-primary: #d29c92!important;
    --slowmove-light-gray: #fafafa;
}

.current-week {
    background-color: var(--slowmove-light-gray);
}


/* Sobreescritura de estilos de rsuite */
.custom-calendar * {
    padding: 0 !important;
}

.custom-calendar > .rs-calendar-header {
    margin: 1rem 0 0.5rem 0;
}

.rs-calendar-header > button {
    padding: 0.25rem 0.75rem !important;
    font-weight: 700;
}

.custom-calendar .rs-calendar-table-cell {
    border: 1px solid #e5e5e5 !important;
}

.custom-calendar .rs-calendar-table-cell {
    border: 1px solid #e9e9e9 !important;
    padding: 8px !important;
}

.custom-calendar .rs-calendar-table-cell-content {
    border: none !important;
    padding: 0.25rem !important;
}

.custom-calendar .rs-calendar-table-header-cell {
    padding: 12px 8px !important;
    font-weight: 500 !important;
    background-color: var(--slowmove-light-gray) !important;
    border: 1px solid #e9e9e9 !important;
}

.custom-calendar .rs-calendar-table-cell-day {
    font-size: 0.9em !important;
    margin-bottom: 0.25rem !important;
}

.rs-navbar.rs-navbar-inverse {
    color: black!important;
    font-size: 1.25rem;
}

.rs-navbar-brand, .rs-navbar-item {
    height: auto!important;
}

.rs-navbar-item:hover {
    background-color: white!important;
}

.rs-panel {
    transition: transform 0.2s ease;
}

.rs-panel:hover {
    transform: translateX(4px);
}

.rs-avatar-xs {
    margin-right: 8px;
}

.rs-calendar-table-cell-is-today .rs-calendar-table-cell-day {
    background-color: var(--slowmove-primary)!important;
}

.rs-btn-subtle.rs-btn-icon:hover,
.rs-btn-subtle.rs-btn-icon:focus {
    background-color: transparent !important;
}

.session-card > .rs-panel-body {
    padding: 0.5rem !important;
}

.image-wrapper > img {
    transition: all 0.5s ease-in-out;
}

.session-card:hover .image-wrapper > img {
    transform: scale(1.4);
}

.image-wrapper {
    overflow: hidden;
}

.location-info-container {
    position: absolute;
    z-index: 10;
    left: 10px;
    bottom: 10px;
    display: flex;
    align-items: center;
    background: white;
    padding: 0.2rem 0.3rem;
    border-radius: 1rem;
    transition: all 0.3s ease-in-out;
}

.location-info-text {
    opacity: 0;
    white-space: nowrap;
    max-width: 0;
    overflow: hidden;
    transition: max-width 0.3s ease-in-out, opacity 0.3s ease-in-out, padding-left 0.3s ease-in-out;
}

.location-info-container:hover {
    max-width: 800px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

.location-info-container:hover .location-info-text {
    max-width: 800px;
    opacity: 1;
    margin-left: 0.5rem;
}

.location-info-container > .rs-btn-icon.rs-btn-sm {
    padding: 0 !important;
}

.snackbar {
    position: absolute!important;
    bottom: 1rem;
    left: 1rem;
    z-index: 2;
}

.default-location {
  border: 1px solid #6eb6f4;
  border-radius: 6px;;
}

.skeleton {
    background: var(--rs-bg-well);
    border-radius: 0.25rem;
    animation: skeleton-pulse 1.5s ease-in-out infinite;
}

@keyframes skeleton-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

/* ===== App Layout ===== */
.al-wrapper { min-height: 100vh; position: relative; }
.al-main { position: relative; z-index: 10; overflow: hidden; }

/* ===== Animated Background ===== */
.ab-container { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.ab-blob1 { position: absolute; top: -25%; left: -25%; width: 60vw; height: 60vw; border-radius: 50%; opacity: 0.3; filter: blur(80px); background: radial-gradient(circle, rgba(59, 130, 246, 0.8), transparent); }
.ab-blob2 { position: absolute; bottom: -25%; right: -25%; width: 50vw; height: 50vw; border-radius: 50%; opacity: 0.25; filter: blur(80px); background: radial-gradient(circle, rgba(168, 85, 247, 0.8), transparent); }
.ab-blob3 { position: absolute; top: 33%; left: 50%; width: 40vw; height: 40vw; border-radius: 50%; opacity: 0.2; filter: blur(80px); background: radial-gradient(circle, rgba(139, 92, 246, 0.8), transparent); }

/* ===== Toaster ===== */
.toaster { position: fixed; bottom: 10px; right: 10px; z-index: 10; }

/* ===== Error Boundary ===== */
.eb-container { display: flex; justify-content: center; align-items: center; min-height: calc(100vh - 3.5rem); padding: 2rem; }
.eb-content { text-align: center; max-width: 28rem; padding: 2rem; border-radius: 0.75rem; border: 1px solid var(--rs-border-primary); background: var(--rs-bg-card); }
.eb-title { margin: 0 0 0.5rem 0; font-size: 1.25rem; }
.eb-message { color: var(--rs-text-secondary); font-size: 0.9rem; margin: 0 0 1.5rem 0; }
.eb-details { font-size: 0.75rem; color: var(--rs-text-secondary); background: var(--rs-bg-well); padding: 0.75rem; border-radius: 0.375rem; text-align: left; overflow-x: auto; margin: 0 0 1.5rem 0; white-space: pre-wrap; word-break: break-word; }
.eb-retry { display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.5rem 1.25rem; border-radius: 0.5rem; border: 1px solid var(--rs-border-primary); background: transparent; cursor: pointer; font-size: 0.875rem; font-weight: 500; color: var(--rs-text-primary); transition: background 0.15s, border-color 0.15s; }
.eb-retry:hover { background: var(--slowmove-primary); border-color: var(--slowmove-primary); color: white; }

/* ===== Navbar ===== */
.nav-bar { position: sticky; top: 0; z-index: 50; backdrop-filter: blur(24px); background: var(--rs-bg-card); border-bottom: 1px solid var(--rs-border-primary); }
.nav-inner { max-width: 80rem; margin: 0 auto; padding: 0 1rem; height: 3.5rem; display: flex; align-items: center; justify-content: space-between; }
.nav-brand { font-weight: 700; font-size: 1.125rem; background: linear-gradient(135deg, #6366f1, #8b5cf6); -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-decoration: none; }
.nav-link { position: relative; padding: 0.375rem 0.75rem; border-radius: 0.5rem; font-size: 0.875rem; font-weight: 500; text-decoration: none; display: flex; align-items: center; gap: 0.375rem; transition: color 0.15s; cursor: pointer; color: var(--rs-text-secondary); }
.nav-link.active { color: var(--rs-primary-700); }
.nav-links { display: flex; align-items: center; gap: 0.25rem; }
.nav-toggle-theme { margin-left: 0.5rem; padding: 0.5rem; border-radius: 0.5rem; border: none; background: transparent; cursor: pointer; display: flex; align-items: center; transition: background 0.15s; }
.nav-active-indicator { position: absolute; inset: 0; border-radius: 0.5rem; z-index: -10; background: linear-gradient(135deg, rgba(99,102,241,0.1), rgba(139,92,246,0.1)); }

/* ===== Home ===== */
.hp-page { padding: 2rem; max-width: 40rem; margin: 0 auto; }
.hp-heading { margin-bottom: 1.5rem; }
.sk-card { flex: 1 1 0; padding: 1rem; border-radius: 0.5rem; border: 1px solid var(--rs-border-primary); background: var(--rs-bg-card); text-align: center; }
.sk-row { display: flex; align-items: center; justify-content: space-between; padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rs-border-primary); }
.sk-summary { margin-top: 1.5rem; }
.sk-cards-row { display: flex; gap: 0.75rem; margin-bottom: 1rem; }
.sk-badges-row { display: flex; gap: 1rem; margin-bottom: 1.5rem; }
.sk-categories { border-radius: 0.5rem; border: 1px solid var(--rs-border-primary); background: var(--rs-bg-card); }
.sk-cat-heading { font-size: 1rem; margin-bottom: 0.75rem; }
.sc-card { flex: 1 1 0; padding: 1rem; border-radius: 0.5rem; border: 1px solid var(--rs-border-primary); background: var(--rs-bg-card); text-align: center; }
.sc-value { font-size: 1.5rem; font-weight: 700; margin-bottom: 0.25rem; }
.sc-label { font-size: 0.8rem; color: var(--rs-text-secondary); }
.sb-row { display: flex; align-items: center; gap: 0.375rem; }
.sb-dot { width: 8px; height: 8px; border-radius: 50%; }
.sb-text { font-size: 0.85rem; }
.cr-row { display: flex; align-items: center; justify-content: space-between; padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rs-border-primary); }
.cr-name { font-weight: 500; }
.cr-detail { display: flex; gap: 1rem; font-size: 0.85rem; color: var(--rs-text-secondary); }
.cs-container { margin-top: 1.5rem; }
.cs-name { font-size: 1.25rem; margin-bottom: 0.25rem; }
.cs-date { color: var(--rs-text-secondary); font-size: 0.9rem; margin-bottom: 1rem; }
.cs-stats-row { display: flex; gap: 0.75rem; margin-bottom: 1rem; }
.cs-badges-row { display: flex; gap: 1rem; margin-bottom: 1.5rem; }
.cs-cat-heading { font-size: 1rem; margin-bottom: 0.75rem; }
.cs-categories { border-radius: 0.5rem; border: 1px solid var(--rs-border-primary); background: var(--rs-bg-card); }

/* ===== Championship ===== */
.cp-page { padding: 2rem; max-width: 60rem; margin: 0 auto; }
.cp-heading { margin-bottom: 1.5rem; }
.cp-picker { margin-bottom: 1.5rem; }
.gv-container { margin-bottom: 2rem; }
.gv-table-style { margin-bottom: 1rem; }
.gv-results-heading { margin-bottom: 0.5rem; font-size: 0.95rem; }
.gv-match { padding: 0.4rem 0; font-size: 0.9rem; line-height: 1.4; border-bottom: 1px solid var(--rs-border-primary); }
.gv-row { display: flex; justify-content: space-between; align-items: center; }
.gv-row > :first-child { flex: 1; }
.gv-score { font-weight: 600; }
.gv-date { font-size: 0.8rem; color: var(--rs-text-secondary); }
.gv-winner { font-weight: 700; color: var(--rs-green-600); }

/* ===== Team ===== */
.badge { padding: 0.2rem 0.5rem; border-radius: 0.375rem; font-size: 0.75rem; font-weight: 600; }
.badge-pending { background: var(--rs-gray-100); color: var(--rs-gray-600); }
.badge-submitted-me { background: var(--rs-blue-100); color: var(--rs-blue-600); }
.badge-submitted-them { background: var(--rs-orange-100); color: var(--rs-orange-600); }
.badge-confirmed { background: var(--rs-green-100); color: var(--rs-green-600); }
.badge-rejected { background: var(--rs-red-100); color: var(--rs-red-600); }
.score-display { font-weight: 600; font-size: 0.85rem; white-space: nowrap; margin-left: 1rem; }
.score-empty { font-weight: 600; font-size: 0.85rem; color: var(--rs-text-secondary); white-space: nowrap; margin-left: 1rem; }
.si-container { margin-top: 0.75rem; padding-top: 0.75rem; border-top: 1px solid var(--rs-border-primary); }
.si-row { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem; }
.si-input { width: 80px; text-align: center; }
.si-remove { background: none; border: none; cursor: pointer; color: var(--rs-red-500); padding: 0.25rem; }
.si-add { display: flex; align-items: center; gap: 0.25rem; background: none; border: 1px dashed var(--rs-border-primary); border-radius: 0.375rem; padding: 0.4rem 0.75rem; cursor: pointer; color: var(--rs-text-secondary); font-size: 0.85rem; width: 100%; justify-content: center; }
.si-actions { margin-top: 0.75rem; display: flex; gap: 0.5rem; justify-content: flex-end; }
.si-separator { font-weight: 600; }
.mc-card { padding: 1rem; border-radius: 0.75rem; border: 1px solid var(--rs-border-primary); background: var(--rs-bg-card); margin-bottom: 0.75rem; }
.mc-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5rem; }
.mc-body { padding: 0.5rem 0; }
.mc-row { display: flex; justify-content: space-between; align-items: center; padding: 0.15rem 0; }
.mc-date { font-size: 0.8rem; color: var(--rs-text-secondary); white-space: nowrap; margin-left: 1rem; }
.mc-date-locked { font-style: italic; opacity: 0.8; }
.mc-date-editable { cursor: pointer; display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.5rem 0.75rem; border-radius: 4px; transition: background-color 0.15s ease; min-height: 44px; }
.mc-date-editable:hover { background-color: var(--rs-bg-hover); }
.mc-date-placeholder { font-style: italic; opacity: 0.6; }
.mc-row .rs-picker-date { flex-shrink: 0; }
.mc-team-name { font-size: 0.85rem; color: var(--rs-text-secondary); }
.mc-team-name-bold { font-size: 0.9rem; color: var(--rs-text-primary); font-weight: 700; }
.mc-team-you { font-size: 0.7rem; color: var(--rs-text-secondary); font-weight: 400; margin-left: 0.25rem; }
.mc-actions { display: flex; gap: 0.5rem; justify-content: flex-end; margin-top: 0.5rem; align-items: center; }
.mc-result { font-size: 0.8rem; display: flex; align-items: center; gap: 0.25rem; }
.mc-result-final { font-size: 0.8rem; display: flex; align-items: center; gap: 0.25rem; color: var(--rs-green-600); }
.mc-result-waiting { font-size: 0.8rem; display: flex; align-items: center; gap: 0.25rem; color: var(--rs-blue-500); }
.kf-page { margin: 4rem 1rem; }
.kf-page-center { margin: 4rem 1rem; text-align: center; }
.kf-center { text-align: center; margin-bottom: 2rem; }
.kf-subtitle { color: var(--rs-text-secondary); font-size: 0.9rem; }
.kf-heading { margin-bottom: 0.5rem; }
.kf-key-style { color: var(--rs-primary-500); margin-bottom: 1rem; }
.kf-field { margin-bottom: 1rem; }
.tp-page { padding: 2rem; max-width: 40rem; margin: 0 auto; }
.tp-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.5rem; }
.tp-heading { margin: 0.25rem 0; }
.tp-subtitle { color: var(--rs-text-secondary); font-size: 0.9rem; }
.tp-logout { display: flex; align-items: center; gap: 0.375rem; padding: 0.5rem 1rem; border-radius: 0.5rem; border: 1px solid var(--rs-border-primary); background: transparent; cursor: pointer; font-size: 0.85rem; color: var(--rs-text-secondary); }
.tp-empty { text-align: center; color: var(--rs-text-secondary); padding: 2rem; }
.tp-section { margin-bottom: 0.75rem; font-size: 0.95rem; color: var(--rs-text-secondary); }

/* ===== Admin ===== */
.adm-card { padding: 1.5rem; border-radius: 0.75rem; border: 1px solid var(--rs-border-primary); background: var(--rs-bg-card); cursor: pointer; transition: border-color 0.2s, box-shadow 0.2s; }
.adm-card-active { padding: 1.5rem; border-radius: 0.75rem; border: 1px solid var(--rs-border-primary); background: var(--rs-bg-card); cursor: pointer; transition: border-color 0.2s, box-shadow 0.2s; border-color: var(--rs-primary-500); box-shadow: 0 0 0 1px var(--rs-primary-500); }
.adm-card-heading { margin: 0; margin-bottom: 0.5rem; font-size: 1rem; }
.adm-card-desc { margin: 0; font-size: 0.85rem; color: var(--rs-text-secondary); }
.adm-couple-row { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; font-size: 0.9rem; }
.adm-couple-row-inner { display: flex; align-items: center; gap: 0.5rem; padding: 0.25rem 0.75rem; font-size: 0.9rem; }
.adm-group-section { margin-bottom: 1rem; padding-bottom: 0.5rem; border-bottom: 1px solid var(--rs-border-primary); }
.adm-pickers-row { display: flex; flex: 1; align-items: center; gap: 0.375rem; }
.adm-picker-wrap { flex: 1; }
.adm-page { padding: 2rem; max-width: 60rem; margin: 0 auto; }
.adm-heading { margin-bottom: 1.5rem; }
.adm-mode-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }

.nav-link:focus-visible,
.nav-toggle-theme:focus-visible,
.mc-date-editable:focus-visible,
.si-add:focus-visible,
.si-remove:focus-visible,
.tp-logout:focus-visible,
.kf-field:focus-visible,
.eb-retry:focus-visible,
.adm-card:focus-visible,
button:focus-visible {
    outline: 2px solid var(--rs-primary-500);
    outline-offset: 2px;
}

@media (max-width: 768px) {
    .ab-blob1, .ab-blob2, .ab-blob3 {
        filter: none !important;
        opacity: 0.1 !important;
    }
    .gv-container { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .gv-table-style { min-width: 500px; }
    .adm-mode-grid { grid-template-columns: 1fr; }
}

[data-theme="dark"] .badge-pending { background: var(--rs-gray-700); color: var(--rs-gray-200); }
[data-theme="dark"] .badge-submitted-me { background: var(--rs-blue-900); color: var(--rs-blue-200); }
[data-theme="dark"] .badge-submitted-them { background: var(--rs-orange-900); color: var(--rs-orange-200); }

.si-hint { font-size: 0.8rem; color: var(--rs-text-secondary); margin-top: 0.5rem; }
.kf-error { color: var(--rs-red-500); font-size: 0.85rem; margin-top: 0.5rem; text-align: center; }
.tp-section-group { margin-top: 1.5rem; }