:root{
    --light-green: #aaff55;
    --easy-green: #c1f7c1;
    --dark-grey: #555555;
    --stream_bg: rgba(0, 74, 93, 0.85);
    --stream_atnlete_bg: rgb(201, 239, 255);
    --stream_atnlete_name: rgba(0, 74, 93, 0.85);
    --deep_blue: rgb(29 147 217);
    --dark_blue: #194c6e;
    --light_danger: #ffc7c7;
    --navy-hover: #28527b;
    --accent-blue: #3b82f6;
    --accent-amber: #f59e0b;
    --accent-green: #10b981;
    --accent-indigo: #6366f1;
    --text-primary: #ffffff;
    --text-muted: #94afd4;
    --border: #3b5e81;
    --border-tab-underline: #dde3eb;
    --radius: 4px;
    --radius-lg: 8px;
    --cream: #FAFAF7;
    --ivory: #F4F2EC;
    --ivory-dark: #e6e3d9;
    --sand: #E8E4D9;
    --terracotta: #C9704A;
    --terracotta-light: #F5EDE8;
    --terracotta-dark: #612811;
    --ink: #1C1A17;
    --muted: #7A756C;
    --border-cream: #DDD9CE;
    --border-warm:  #e0d4cc;
    --white: #FFFFFF;
    --success-bg: #EEF6F0;
    --success-accent: #3D8C5A;
    --hover-blue: #f2fcff;
    --navy:         #315f94;
    --navy-mid:     #2a5382;
    --navy-light:   #5587c1;
    --blush:        #f3ece7;
    --blush-mid:    #e4cfc5;
    --rose-gold:    #b07a5e;
    --rose-light:   #c8947a;
    --border-light:        #f7f4f1;
    --warm-white:   #ffffff;
    --slate:        #e8edf3;
    --text-dark:    #1c2333;
    --text-mid:     #5a6275;
    --text-light:   #8e97a8;
    --border-cold:       #dde3eb;
    --border-cold-warm:  #e0d4cc;
    --danger:       #c0392b;
    --danger-light: #fdf0ef;
    --danger-border:#e8b4b0;
    --success:      #2d7a52;
    --success-light:#e8f5ee;
    --success-border:#b8ddc8;
    --shadow-card:  0 1px 4px rgba(0,0,0,0.06), 0 4px 16px rgba(0,0,0,0.06);
    --shadow-drop:  0 8px 32px rgba(0,0,0,0.14);
    --scored:          #258f86;
    --scored-dk:       #1a6b63;
    --scoreed-attention: #a64f4f;
    --score-approved: #ffc86c;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html {
    scrollbar-width: thin;
    scrollbar-color: var(--navy-hover) #f1f1f1;
    scrollbar-gutter: stable;
}
body {

    background: #FFFFFF;
    color: var(--text-dark);
    min-height: 100vh;

}

/* ════════════════════════════════
   NAVBAR
════════════════════════════════ */
.app-header {
    background: var(--navy);
    height: 50px;
    display: flex;
    align-items: center;
    padding: 0 28px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.20);
    top: 0;
    z-index: 200;
}

.nav-sep {
    width: 1px;
    height: 20px;
    background: rgba(255,255,255,0.15);
    margin: 0 16px;
    flex-shrink: 0;
}

.nav-links {
    display: flex;
    align-items: center;
    gap: 2px;
    flex: 1;
    flex-direction: row;
    justify-content: center;
}

.nav-links a {
    color: rgba(255,255,255,0.65);
    text-decoration: none;
    font-size: 11.5px;
    font-weight: 700;
    padding: 5px 13px;
    border-radius: 6px;
    transition: all .18s;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
.nav-links a:hover { color: #fff; background: rgba(255,255,255,0.10); }
.nav-links a.active { color: #fff; background: rgba(255,255,255,0.14); }

.nav-right {
    display: flex;
    align-items: center;
    gap: 4px;
    position: relative;
}

.nav-icon-btn {
    color: rgba(255,255,255,0.65);
    font-size: 16px;
    cursor: pointer;
    transition: color .18s;
    text-decoration: none;
    padding: 7px 9px;
    border-radius: 6px;
    display: flex; align-items: center;
}
.nav-icon-btn:hover { color: #fff; background: rgba(255,255,255,0.10); }

/* ── USER DROPDOWN TRIGGER ── */
.user-menu-wrap { position: relative; }

.user-trigger {
    display: flex;
    align-items: center;
    gap: 9px;
    cursor: pointer;
    padding: 4px 10px 4px 4px;
    border-radius: 28px;
    border: 1px solid rgba(255,255,255,0.18);
    transition: all .18s;
    user-select: none;
}
.user-trigger:hover { background: rgba(255,255,255,0.10); border-color: rgba(255,255,255,0.30); }

.user-avatar {
    width: 32px; height: 32px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    border: 1.5px solid rgba(255,255,255,0.28);
}
.user-avatar img { width: 100%; height: 100%; object-fit: cover; }

.user-name-short {
    color: rgba(255,255,255,0.85);
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.user-chevron {
    color: rgba(255,255,255,0.50);
    font-size: 11px;
    transition: transform .22s;
}
.user-menu-wrap.open .user-chevron { transform: rotate(180deg); }

/* ── DROPDOWN PANEL ── */
.user-dropdown {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    width: 300px;
    background: var(--warm-white);
    border-radius: 14px;
    box-shadow: var(--shadow-drop);
    border: 1px solid var(--border-cold);
    overflow: hidden;
    opacity: 0;
    transform: translateY(-8px) scale(0.98);
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease;
    z-index: 300;
}
.user-menu-wrap.open .user-dropdown {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: all;
}

.dd-header {
    background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%);
    padding: 18px 20px;
    display: flex;
    align-items: center;
    gap: 14px;
}
.dd-avatar-lg {
    width: 46px; height: 46px;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,0.28);
    overflow: hidden;
    flex-shrink: 0;
}
.dd-avatar-lg img { width: 100%; height: 100%; object-fit: cover; }
.dd-role {
    color: rgba(255,255,255,0.92);
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 3px;
}
.dd-email { color: rgba(255,255,255,0.52); font-size: 11.5px; }

.dd-section-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--text-light);
    padding: 12px 16px 5px;
}

.dd-comp-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: calc(100% - 24px);
    margin: 0 12px;
    padding: 9px 14px;
    background: var(--slate);
    border: 1px solid var(--border-cold);
    border-radius: 8px;
    font-family: 'Nunito', sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-dark);
    cursor: pointer;
    transition: all .16s;
    text-align: left;
}
.dd-comp-btn:hover { background: var(--blush); border-color: var(--border-cold-warm); }
.dd-comp-chevron { color: var(--text-light); font-size: 11px; transition: transform .2s; }
.dd-comp-btn.sub-open .dd-comp-chevron { transform: rotate(180deg); }

.dd-sub-menu {
    background: var(--warm-white);
    margin: 4px 12px 0;
    border-radius: 8px;
    border: 1px solid var(--border-cold);
    overflow: hidden;
    max-height: 0;
    transition: max-height .22s ease;
}
.dd-sub-menu.open { max-height: 200px; margin-bottom: 4px; }
.dd-sub-item {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 9px 14px;
    color: var(--text-dark);
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    border-bottom: 1px solid var(--border-cold);
    transition: background .14s;
}
.dd-sub-item:last-child { border-bottom: none; }
.dd-sub-item:hover { background: var(--blush); }
.dd-sub-item i { color: var(--rose-gold); font-size: 12px; }

.dd-nav-links {
    padding: 6px 12px 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.dd-nav-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 11px;
    border-radius: 6px;
    border: 1px solid var(--border-cold);
    color: var(--text-mid);
    text-decoration: none;
    font-size: 12.5px;
    font-weight: 600;
    transition: all .16s;
    background: var(--warm-white);
    flex: 1;
}
.dd-nav-link:hover { background: var(--slate); color: var(--text-dark); border-color: var(--navy-light); }
.dd-nav-link i { font-size: 13px; color: var(--navy-light); }

.dd-divider { height: 1px; background: var(--border-cold); margin: 6px 0; }

.dd-footer { padding: 8px 12px 12px; }
.dd-logout {
    display: flex;
    align-items: center;
    gap: 7px;
    width: 100%;
    padding: 9px 14px;
    background: transparent;
    border: 1px solid var(--border-cold);
    border-radius: 8px;
    color: var(--text-mid);
    font-family: 'Nunito', sans-serif;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all .16s;
    justify-content: center;
}
.dd-logout:hover { background: #fff0f0; border-color: #e0b0b0; color: #b04040; }

/* ════════════════════════════════
   MAIN / LAYOUT
════════════════════════════════ */


main {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: stretch;
    gap: 20px;
}
.comp_page {
    width: 980px;
    margin: 20px auto 0;
    /* padding: 34px 24px 45px; */
}
.page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    flex-wrap: wrap;
    flex-direction: row;
    align-content: center;
}


.page-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 35px;
    font-weight: 400;
    color: var(--text-dark);
    line-height: 1.05;
    letter-spacing: -0.02em;
    margin-bottom: 15px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
}

.page-stats {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 10px;
}

.btn-create {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: var(--navy);
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 10px 22px;
    font-family: 'Nunito', sans-serif;
    font-size: 12.5px;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    transition: all .2s;
    box-shadow: 0 2px 10px rgba(30,53,80,0.22);
}
.btn-create:hover {
    background: var(--navy-mid);

    box-shadow: 0 4px 16px rgba(30,53,80,0.28);
    color: #fff;
}


/* ════════════════════════════════
   EVENT CARD
════════════════════════════════ */
.event-card {
    background: var(--warm-white);
    border-radius: 14px;
    box-shadow: var(--shadow-card);
    overflow: hidden;
    border: 1px solid var(--border-cold);
    animation: cardIn .45s ease both;
    transition: box-shadow .22s, transform .22s;
    margin-bottom: 20px;
}

.event-card:hover {
    box-shadow: 0 6px 28px rgba(0,0,0,0.10);

}
@keyframes cardIn {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* TOP BAND */
.card-top {
    display: flex;
    align-items: stretch;
    border-bottom: 1px solid var(--border-cold);
}
.card-stripe-v {
    width: 4px;
    flex-shrink: 0;
    background: linear-gradient(180deg, var(--rose-gold), #d4b8ae);
}
.card-title-area {
    flex: 1;
    padding: 16px 22px;
    background: linear-gradient(108deg, #ede6e0 0%, #f7f4f1 100%);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.card-title-left { display: flex; align-items: center; gap: 13px; }
.card-trophy-icon {
    width: 42px; height: 42px;
    border-radius: 10px;
    background: var(--navy);
    display: flex; align-items: center; justify-content: center;
    color: #fff;
    font-size: 19px;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(30,53,80,0.22);
}
.card-title-link {
    font-family: 'Cormorant Garamond', serif;
    font-size: 20px;
    font-weight: 700;
    color: var(--navy);
    text-decoration: none;
    letter-spacing: -0.01em;
    transition: color .18s;
    display: block;
    line-height: 1.15;
}
.card-title-link:hover { color: var(--rose-gold); }


/* CARD BODY */
.card-body { padding: 22px 24px; }

.detail-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 18px;
}
.detail-block {
    background: var(--border-light);
    border: 1px solid var(--border-cold);
    border-radius: 10px;
    padding: 12px 14px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
.detail-block-full { grid-column: 1 / -1; }
.detail-block-icon {
    width: 30px; height: 30px;
    border-radius: 7px;
    background: var(--slate);
    display: flex; align-items: center; justify-content: center;
    color: var(--navy-light);
    font-size: 14px;
    flex-shrink: 0;
}
.detail-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--text-light);
    margin-bottom: 3px;
}
.detail-value {
    font-size: 13px;
    font-weight: 600;
    color: var(--text-dark);
    line-height: 1.35;
}

.card-divider { height: 1px; background: var(--border-cold); margin: 18px 0; }

/* TAGS */
.tags-row { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 0px; }
.tag {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: var(--slate);
    border: 1px solid var(--border-cold);
    color: var(--navy);
    border-radius: 6px;
    padding: 5px 12px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.02em;
}
.tag i { color: var(--navy-light); font-size: 12px; }

/* STREAM SECTION */
.subsection-title {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--text-light);
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.subsection-title i { color: var(--rose-gold); }

.stream-links { display: flex; flex-wrap: wrap; gap: 7px; }
.stream-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--navy);
    text-decoration: none;
    font-size: 12.5px;
    font-weight: 600;
    padding: 7px 13px;
    border-radius: 7px;
    border: 1px solid var(--border-cold);
    background: var(--warm-white);
    transition: all .18s;
}
.stream-link i { color: var(--rose-gold); font-size: 13px; }
.stream-link:hover {
    border-color: var(--rose-gold);
    color: var(--rose-gold);
    background: var(--blush);

    box-shadow: 0 2px 8px rgba(176,122,94,0.14);
}

/* CARD FOOTER */
.card-footer {
    padding: 14px 24px;
    background: var(--border-light);
    border-top: 1px solid var(--border-cold);
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.card-footer-block {
    padding: 14px 24px;
    background: var(--border-light);
    border-top: 1px solid var(--border-cold);
    display: block;
    align-items: center;
    justify-content: space-between;
}
.btn-manage {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: var(--rose-gold);
    color: #fff;
    border: none;
    border-radius: 7px;
    padding: 9px 20px;
    font-family: 'Nunito', sans-serif;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    transition: all .2s;
    box-shadow: 0 2px 8px rgba(176,122,94,0.28);
}
.btn-manage:hover { background: var(--rose-light); color: #fff; box-shadow: 0 4px 14px rgba(176,122,94,0.36); }

.btn-edit {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--warm-white);
    color: var(--text-mid);
    border: 1px solid var(--border-cold);
    border-radius: 7px;
    padding: 8px 18px;
    font-family: 'Nunito', sans-serif;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    transition: all .2s;
}
.btn-edit:hover { border-color: var(--text-mid); color: var(--text-dark); background: var(--slate); }

/* Overlay */
.dd-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 150;
}
.dd-overlay.active { display: block; }

/* Action buttons in header */
.header-actions { display:flex;align-items:center;gap:8px; }

.btn-save {
    display:inline-flex;align-items:center;gap:7px;
    background:var(--success);
    color:#fff;border:none;
    border-radius:8px;
    padding:10px 20px;
    font-size:12.5px;
    font-weight:700;
    cursor:pointer;
    text-decoration:none;
    letter-spacing:0.05em;
    text-transform:uppercase;
    transition:all .2s;box-shadow:0 2px 10px rgba(45,122,82,0.22);
}
.btn-save:hover { filter:brightness(1.1);box-shadow:0 4px 16px rgba(45,122,82,0.30); }

.btn-cancel {
    display:inline-flex;align-items:center;gap:6px;
    background:var(--warm-white);color:var(--text-mid);
    border:1px solid var(--border);border-radius:8px;
    padding:9px 18px;font-family:'Nunito',sans-serif;font-size:12.5px;font-weight:600;
    cursor:pointer;text-decoration:none;letter-spacing:0.03em;
    transition:all .2s;
}
.btn-cancel:hover { border-color:var(--text-mid);color:var(--text-dark);background:var(--slate); }

.btn-delete {
    display:inline-flex;align-items:center;gap:6px;
    background:transparent;color:var(--danger);
    border:1px solid var(--danger-border);border-radius:8px;
    padding:9px 16px;font-family:'Nunito',sans-serif;font-size:12.5px;font-weight:600;
    cursor:pointer;text-decoration:none;
    transition:all .2s;
}
.btn-delete:hover { background:var(--danger-light);border-color:var(--danger); }

/* ════════ TABS ════════ */
.tabs-nav {
    display:flex;align-items:center;gap:2px;
    border-bottom:2px solid var(--border-tab-underline);
    margin-bottom:24px;
}
.tab-btn {
    display:inline-flex;align-items:center;gap:6px;
    padding:10px 18px;
    font-family:'Nunito',sans-serif;font-size:12.5px;font-weight:700;
    letter-spacing:0.04em;text-transform:uppercase;
    color:var(--text-light);background:transparent;border:none;
    border-bottom:2px solid transparent;margin-bottom:-2px;
    cursor:pointer;transition:all .18s;white-space:nowrap;
}
.tab-btn i { font-size:14px; }
.tab-btn:hover { color:var(--text-mid); }
.tab-btn.active { color:var(--navy);border-bottom-color:var(--rose-gold); }

/* Tab panels */
.tab-panel { display:none; animation:fadeIn .25s ease; }
.tab-panel.active { display:block; }
@keyframes fadeIn { from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:translateY(0)} }

/* ════════ SECTION CARDS ════════ */
.section-card {
    background:var(--warm-white);
    border-radius:14px;
    box-shadow:var(--shadow-card);
    border:1px solid var(--border-tab-underline);
    overflow:hidden;
    margin-bottom:16px;
}

.section-card-header {
    display:flex;align-items:center;gap:12px;
    padding:14px 22px;
    background:linear-gradient(108deg,#ede6e0 0%,#f7f4f1 100%);
    border-bottom:1px solid var(--border-tab-underline);
}
.section-card-icon {
    width:34px;height:34px;border-radius:8px;
    background:var(--navy);
    display:flex;align-items:center;justify-content:center;
    color:#fff;font-size:15px;flex-shrink:0;
    box-shadow:0 2px 8px rgba(30,53,80,0.18);
}
.section-card-title {
    font-family:'Cormorant Garamond',serif;
    font-size:19px;font-weight:700;color:var(--navy);
    letter-spacing:-0.01em;
}

.section-card-body { padding:22px; }

/* ════════ FORM ELEMENTS ════════ */
.form-row { display:grid;gap:14px;margin-bottom:14px; }
.form-row.cols-2 { grid-template-columns:1fr 1fr; }
.form-row.cols-3 { grid-template-columns:1fr 1fr 1fr; }
.form-row.cols-4 { grid-template-columns:2fr 1fr 1fr 1fr; }
.form-row.cols-auto { grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); }

.form-group { display:flex;flex-direction:column;gap:6px; }
.form-group.full { grid-column:1/-1; }

label.form-label {
    font-size:12px;
    font-weight:700;
    letter-spacing:0.12em;
    text-transform:uppercase;color:var(--text-mid);
    margin: 0;
}

.form-control, .form-select {
    font-family:'Nunito',sans-serif;
    font-size:13.5px;font-weight:500;
    color:var(--text-dark);
    background:var(--cream);
    border:1px solid var(--border-tab-underline);
    border-radius:8px;
    padding:9px 13px;
    transition:all .18s;
    width:100%;
    outline:none;
}
.form-control:focus, .form-select:focus {
    border-color:var(--navy-light);
    background:var(--warm-white);
    box-shadow:0 0 0 3px rgba(58,95,138,0.10);
}
textarea.form-control { resize:vertical;min-height:90px; }

/* API row */
.api-row {
    background:var(--slate);
    border:1px solid var(--border-tab-underline);
    border-radius:10px;
    padding:14px 16px;
    margin-bottom:16px;
    display:flex;flex-direction:column;gap:10px;
}
.api-row-top {
    display:flex;align-items:center;gap:10px;
}
.api-input-wrap { display:flex;gap:8px;flex:1; }
.api-input-wrap .form-control { flex:1; }

.btn-api {
    display:inline-flex;align-items:center;gap:6px;
    background:var(--navy);color:#fff;border:none;border-radius:8px;
    padding:9px 16px;font-family:'Nunito',sans-serif;font-size:13px;font-weight:600;
    cursor:pointer;white-space:nowrap;transition:all .18s;flex-shrink:0;
}
.btn-api:hover { background:var(--navy-mid); }

/* Toggle switch */
.switch-wrap {
    display:flex;align-items:center;gap:10px;
    font-size:13px;font-weight:500;color:var(--text-mid);
}
.switch {
    position:relative;width:38px;height:22px;flex-shrink:0;
}
.switch input { opacity:0;width:0;height:0; }
.switch-slider {
    position:absolute;inset:0;background:var(--border-tab-underline);
    border-radius:22px;cursor:pointer;transition:.22s;
}
.switch-slider::before {
    content:'';position:absolute;width:16px;height:16px;
    left:3px;bottom:3px;background:#fff;border-radius:50%;
    transition:.22s;box-shadow:0 1px 4px rgba(0,0,0,0.18);
}
.switch input:checked + .switch-slider { background:var(--navy-light); }
.switch input:checked + .switch-slider::before { transform:translateX(16px); }

/* Progress bar */
.progress-wrap {
    height:6px;background:var(--border);border-radius:6px;overflow:hidden;
}
.progress-bar {
    height:100%;background:linear-gradient(90deg,var(--navy-light),var(--rose-gold));
    border-radius:6px;width:0;transition:width .3s;
    background-size:200% 100%;animation:shimmer 1.5s infinite;
}
@keyframes shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

/* ════════ CHECKBOX BUTTON GROUP ════════ */
.check-group { display:flex;flex-wrap:wrap;gap:6px; }
.check-group input[type=checkbox],
.check-group input[type=radio] { display:none; }
.check-btn {
    display:inline-flex;align-items:center;justify-content:center;
    min-width:42px;padding:7px 14px;
    background:var(--warm-white);border:1px solid var(--border);
    border-radius:7px;font-family:'Nunito',sans-serif;
    font-size:12.5px;font-weight:700;color:var(--text-mid);
    cursor:pointer;transition:all .15s;user-select:none;
}
.check-btn.full-width{
    flex: 1;

}
.check-group input:checked + .check-btn {
    background:var(--navy);color:#fff;border-color:var(--navy);
    box-shadow:0 2px 8px rgba(30,53,80,0.20);
}
.check-btn:hover { border-color:var(--navy-light);color:var(--navy); }

/* ════════ INFO BOX (API hint) ════════ */
.info-box {
    display:flex;align-items:flex-start;gap:10px;
    background:var(--blush);border:1px solid var(--border-warm);border-radius:9px;
    padding:11px 14px;font-size:12.5px;color:var(--text-mid);font-weight:500;
}
.info-box i { color:var(--rose-gold);font-size:15px;flex-shrink:0;margin-top:1px; }

/* ════════ FORM DIVIDER ════════ */
.form-divider {
    display:flex;
    align-items:center;
    gap:12px;
    margin:30px 0 20px;
}
.form-divider:first-child{
    margin:0 0 20px;
}
.form-divider-line { flex:1;height:1px;background:var(--border-tab-underline); }
.form-divider-label {
    font-size:12px;
    font-weight:700;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--text-mid);
    white-space:nowrap;
}

.day-toggle {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: linear-gradient(0deg, var(--navy-mid) 0%, var(--navy-light) 100%);
    border: 1px solid #252525;
    cursor: pointer;
    font-family: 'Nunito', sans-serif;
    text-align: left;
    color: #FFFFFF;
}
.day-toggle.bg-danger{
    background: var(--danger);
}
.day-toggle.bg-success{
    background: var(--success-accent);
}


/* ─── Buttons ─── */
.btn-menu {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 5px 10px;
    border-radius: var(--radius);
    font-family: 'Manrope', sans-serif;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background 0.18s, border-color 0.18s, transform 0.12s;
    white-space: nowrap;
    text-decoration: none;
    color: var(--text-primary);
    position: relative;
    overflow: hidden;
}

.btn-menu:active { transform: scale(0.97); }

/* Default ghost */
.btn-ghost {
    background: rgba(255,255,255,0.05);
    border-color: var(--border);
}
.btn-ghost:hover {
    background: var(--navy-hover);
    border-color: rgba(100,160,255,0.25);
}

/* Blue */
.btn-blue {
    background: #387ef0;
    border-color: #89b6ff;
    color: #ffffff;
}
.btn-blue:hover:not(.loading) {
    background: #2360c9;
    border-color: #e7f0ff;
    color: #ffffff;
}
.btn-light-blue {
    background: #4a94b1;
    border-color: #3e7c94;
    color: #ffffff;
}
.btn-light-blue:hover:not(.loading) {
    background: #28627a;
    border-color: #e7f0ff;
    color: #ffffff;
}

/* Amber */
.btn-amber {
    background: #b18b4a;
    border-color: #ffebcb;
    color: #ffffff;
}
.btn-amber:hover:not(.loading) {
    background: #9b793e;
    border-color: #ffffff;
    color: #ffffff;
}

/* Green */
.btn-green {
    background: rgba(16,185,129,0.12);
    border-color: rgba(16,185,129,0.50);
    color: #6ee7b7;
}
.btn-green:hover:not(.loading) {
    background: rgba(16,185,129,0.22);
    border-color: rgba(16,185,129,0.60);
    color: #a7f3d0;
}
/* ─────────────────────────────────────────
     LOADING STATE
  ───────────────────────────────────────── */
.btn.loading {
    pointer-events: none;
    cursor: not-allowed;
    opacity: 0.75;
    transform: none !important;
}

/* Shimmer sweep */
.btn.loading::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        105deg,
        transparent 30%,
        rgba(255,255,255,0.12) 50%,
        transparent 70%
    );
    background-size: 200% 100%;
    animation: shimmer 1.4s infinite linear;
}

@keyframes shimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* Spinner that replaces the left icon */
.btn-menu .btn-spinner {
    display: none;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    border-radius: 50%;
    border: 2px solid currentColor;
    border-top-color: transparent;
    animation: spin 0.7s linear infinite;
}

.btn-menu.loading .btn-spinner { display: block; }
.btn-menu.loading .btn-icon     { display: none; }

.music-download-cache.btn-icon{
    padding: 4px;
}

.btn-menu.loading .btn-label { animation: none; }

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Pulse glow on border */
.btn-ghost.loading  { animation: pulse-ghost  1.6s ease-in-out infinite; }
.btn-blue.loading   { animation: pulse-blue   1.6s ease-in-out infinite; }
.btn-amber.loading  { animation: pulse-amber  1.6s ease-in-out infinite; }
.btn-green.loading  { animation: pulse-green  1.6s ease-in-out infinite; }

@keyframes pulse-ghost  { 0%,100%{box-shadow:0 0 0 0 rgba(100,160,255,0.0)} 50%{box-shadow:0 0 0 3px rgba(100,160,255,0.18)} }
@keyframes pulse-blue   { 0%,100%{box-shadow:0 0 0 0 rgba(59,130,246,0.0)}  50%{box-shadow:0 0 0 3px rgba(59,130,246,0.25)} }
@keyframes pulse-amber  { 0%,100%{box-shadow:0 0 0 0 rgba(245,158,11,0.0)}  50%{box-shadow:0 0 0 3px rgba(245,158,11,0.22)} }
@keyframes pulse-green  { 0%,100%{box-shadow:0 0 0 0 rgba(16,185,129,0.0)}  50%{box-shadow:0 0 0 3px rgba(16,185,129,0.22)} }

/* ─── Dropdown menu ─── */
.button-top-menu .dropdown-menu {
    background: #2b67a3f0;
    border: 1px solid rgba(100, 160, 255, 0.2);
    border-radius: var(--radius-lg);
    padding: 6px;
    min-width: 180px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(100, 160, 255, 0.06);
    z-index: 999;
}

.button-top-menu .dropdown-green{
    background: rgb(26 106 40 / 85%);
}

@keyframes menuIn {
    from { opacity: 0; transform: translateX(-50%) translateY(-6px); }
    to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}

.dropdown.open .dropdown-menu { display: block; }

.button-top-menu .dropdown-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 10px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    color: var(--text-primary);
    text-decoration: none;
    transition: background 0.15s;
    border: 1px solid #ffffff66;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    margin-bottom: 5px;
}
.button-top-menu .dropdown-item:hover {
    background: var(--navy-hover);
    color: #ffffff;
}

.button-top-menu .dropdown-item:focus {
    background: var(--navy-hover);
    color: #ffffff;
}

.button-top-menu .dropdown-divider {
    height: 1px;
    background: var(--border);
    margin: 4px 6px;
}

.navbar-expand {
    flex-wrap: nowrap;
    justify-content: flex-start;
}
.stream_activity_header{
    margin: 30px;
}
.activity_name{
    background-color: var(--dark_blue);
    padding: 10px 30px;
    border-radius: 50px;
    font-size: calc(1.2rem);
    color: #FFFFFF;
    font-weight: 600;
    float: left;
    max-width: 80%;
}
.activity_time_block{
    text-align: center;
    float: right;
}
.stream_rosturnir{
    font-size: 12px;
    font-weight: 600;
    text-align: right;
    letter-spacing: 1px;
    color: #FFFFFF;
}
.activity_time{
    background-color: var(--dark_blue);
    padding: 5px 10px;
    border-radius: 2px 20px;
    font-size: 1.2rem;
    color: #FFFFFF;
    font-weight: 400;
}
.navbar_activity_text{
    color: #FFFFFF;
    width: 100%;
}
.nav-header-link{
    display: flex;
    /* color: white; */
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    gap: 20px;
}
.nav-header-link a {
    color: #FFFFFF;
    text-decoration: none;
    /* background: #4780b2; */
    padding: 2px 10px;
    border-radius: 10px
}
.nav-header-link a:hover{
    background: var(--navy-hover);
}
.nav-header-link a.active{
    background: var(--navy-hover);
}
.activity-top-info{
    background: var(--ivory-dark);
    padding: 10px;
    border-radius: 10px;
    margin-bottom: 5px;
    font-size: .9rem;
}
div.accordion-body{
    background-color: #FFFFFF;
}
.gold-gradient {
    background: linear-gradient(
        45deg,
        #ffd700 0%,
        #ffc83c 25%,
        #ffec8b 50%,
        #ffc83c 75%,
        #ffd700 100%
    );
    background-size: 400% 400%;
    animation: gradient-shift 8s ease infinite;
    position: relative;
    overflow: hidden;
}

.stream_athlete_bg{
    background: var(--stream_atnlete_bg);
}

/* Для текста с градиентом */
.gold-text {
    background: linear-gradient(
        45deg,
        #ffd700 0%,
        #daa520 25%,
        #ffec8b 50%,
        #daa520 75%,
        #ffd700 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    background-size: 400% 400%;
    animation: gradient-shift 8s ease infinite;
}

@keyframes gradient-shift {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.music_icons {
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    gap: 0.2rem 1rem;
    margin: auto;
    padding: 0;
    max-width: 100px;
}
.music_icons_grid {
    display: grid;
    flex-wrap: wrap;
    /* align-content: center; */
    justify-content: center;
    /* align-items: center; */
    gap: 0.2rem;
    /* margin: auto; */
    /* padding: 0; */
    max-width: 100px;
    grid-template-columns: 1fr 1fr;
    justify-items: center;
}

/* Дополнительные стили для эффекта свечения
.gold-gradient::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: radial-gradient(
        circle at center,
        rgba(255, 215, 0, 0.4) 0%,
        transparent 70%
    );
    animation: glow 3s ease-in-out infinite;
}*/

@keyframes glow {
    0%, 100% {
        opacity: 0.8;
    }
    50% {
        opacity: 0.3;
    }
}

.stream_cover{
    margin: 10px auto;
    filter: drop-shadow(0px 5px 2px rgba(0, 0, 0, 0.2));
    opacity: 0;
    min-width: 70%;
    max-width: 100%;
}
.stream_athlete{
    background-color: var(--stream_atnlete_bg);
    padding: 5px;
    border-radius: 25px;
    color: #FFFFFF;

}
.stream_athlete_top{
    display: flex;
    gap: 10px;
}
.stream_athlete_name{
    font-size: 1.5rem;
    padding: 2px 10px;
    /*background: #15415e;*/
    background-color: var(--stream_atnlete_name);
    border-radius: 20px;
    width: 100%;
    font-weight: 600;
    text-align: center;
}
.stream_apparatus{
    padding: 2px 10px;
    width: 40%;
    text-align: center;
    font-size: 1.5rem;
    color: rgba(64,78,101,1);
    font-weight: 600;
    border: 2px dashed #404e65;
    border-radius: 20px;
    margin-left: 10px;
}
.stream_info{
    background: var(--stream_atnlete_name);
    border-radius: 20px;
    font-weight: 600;
    text-align: center;
    padding: 7px;
    overflow: hidden;
    min-width: 100px;
    white-space: nowrap;
}
.stream_info.stream_school_label{
    width: 100%;
}
.stream_info.stream_coach_name{
    width: 61%;
}
.diploma_athlete_select{
    cursor: pointer;
    padding: 10px;
    border-radius: 10px;
    border: 1px solid var(--dark-grey);
}
.diploma_athlete_select.checked{
    background-color: var(--light-green);
    border: none;
}
.select_all_athlete{
    cursor: pointer;
}
.select_all_athlete:hover{
    background-color: var(--light-green) !important;
}
.gradient-custom-2 {
    /* fallback for old browsers */
    background: #fc9090;

    /* Chrome 10-25, Safari 5.1-6 */
    background: -webkit-linear-gradient(to right, #ee7724, #d8363a, #dd3675, #b44593);

    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    background: linear-gradient(to right, #ee7724, #d8363a, #dd3675, #b44593);
    }

    .gradient-button-2 {
        /* fallback for old browsers */
        background: #fc9090;

        /* Chrome 10-25, Safari 5.1-6 */
        background: -webkit-linear-gradient(to right, #ee7724, #d8363a, #dd3675, #b44593);

        /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
        background: linear-gradient(to right, #ee7724, #d8363a, #dd3675, #b44593);
        }

    .gradient-button-2:hover{
    /* fallback for old browsers */
    background: #fc9090;

    /* Chrome 10-25, Safari 5.1-6 */
    background: -webkit-linear-gradient(to right, #b65c1c, #962527, #91224c, #992b78);

    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    background: linear-gradient(to right, #b65c1c, #962527, #91224c, #992b78);
    }

    .text-justify{
        text-align: justify !important;
    }
    .paragraph{
        text-indent: 20px;
    }

    .border-right-2{
        border-right: 2px solid #b65c1c;
    }


input::placeholder {
  color: #ccc !important;
  opacity: 0.5; /* Firefox */
}
    @media (min-width: 768px) {
    .gradient-form {
    height: 100vh !important;
    }
    }
    @media (min-width: 769px) {
    .gradient-button-2 {
    border-top-right-radius: .3rem;
    border-bottom-right-radius: .3rem;
    }
    }



.flowItem{
	border: none;
}
.flowItem .accordion-body{
	background: #f8f8f8;
	padding: 10px 5px 0px 5px;
}
.flow_info{
	display: flex;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
    margin-right: 5px;
	gap: 0.25rem;
}
.flowAccordion{
    border: 1px solid #000000;
    background-color: #f4f4f4;
}
.flowAccordion:hover{
    background-color: #e0f0ff;
}
.flow-placeholder {
    background: #e0f0ff;
    border: 2px dashed #90c0e0;
    border-radius: 4px;
    margin-bottom: 4px; /* соответствует mb-1 на .flowItem */
}
.athlet-select{
	min-width: 95px;
    max-height: fit-content;
    color: var(--navy);
}
.athlet-select.btn-secondary{
    background: var(--navy);
    color: #FFFFFF;
}
.list-athlete a{
    color: var(--navy);
}
.list-athlete .d-flex{
    align-items: center;
}
.athlet-select.btn-secondary:hover{
    background: none;
    color: var(--navy);
}
.protocol_del_btnGroup{
	text-align: center;
    margin: auto;
	min-width: 50px;
}
.athlet-select-ingroup{
	margin: auto;
	min-width: 80px;
    text-align: center;
}
.protocol-print-btn{
    display: flex;
    align-items: center;
    border: 1px solid #000;
    padding: 5px 12px;
    background: #ebf6ff;
    color: #000000;
}
.protocol-print-btn:hover{
    background: #bee5ff;
    color: #000000;
}
.my-accordion-header{
	cursor: pointer;
	display: flex;
    align-items: center;
	justify-content: space-between;
    flex-wrap: nowrap;
}
.protocol-header-name{
	display: flex;
    align-items: center;
}
.dflex-center{
	display: flex;
    align-items: center;
}
.tourney-accordion-header{
	cursor: pointer;
}
.flow_info_label{
	min-width: 75px;
    text-align: center;
}
li.list-athlete {
	padding: 5px;
    font-weight: 600;
    margin-bottom: 5px;
	background-color: #e7eff4;
	border: 1px solid #9797c8;
}

.bgcolor_dark_blue{
    background: #306192;
}
.bgcolor_semidark_blue{
    background: #356da4;
    border-top: 1px solid #5a99d0;
}
.sortableDay{
	height: calc(100vh - 80px);
    overflow-y: auto;
	overflow-x : hidden;
	z-index:0
}
.ProtocolPanels{
    height: calc(100vh - 23px);
    overflow-y: scroll;
    z-index:0;
	scrollbar-width: thin;
	scrollbar-color: auto #306192;
	scrollbar-gutter: stable;
}
.SortGroup2{
	height: calc(100vh - 80px);
    overflow-y: auto;
	overflow-x : hidden;
	z-index:0
}
.number-athlete-out{
	position: absolute;
    left: 20px;
    min-width: 40px;

}
.athlete_score_input{
    border: 0;
    text-align: center;
    background: none;
    font-weight: bold;
	width: 100%;
}
.athlete_score_input:focus{
	outline: none;
}

.athlete_score_input.hide{
	display: none;
}
.bg-info-color{
	background-color: #c2f2fb;
}
ol.ol-list-athlete{
	min-height: 10px;
}

li:nth-child(odd).list-athlete  {
  background-color: #e9e9f9;
  #background-color: #f5fcfe
}
li.list-athlete > div{
	overflow: auto;
}
.add-athlet-group{
	background-color: rgb(209 236 172) !important;
}
.violet-tooltip {
  --bs-tooltip-bg: var(--bd-violet-bg);
  --bs-tooltip-color: var(--bs-white);
}
.dropdown-menu span{
	cursor: pointer;
}
.bg-green{
	background: #c1f7c1;
}
.bg-cyan{
	/*background-color: #408397 !important;*/
    background: var(--navy-light);
}
.pointer{
	cursor: pointer;
}
.alrt-hide{
	display: none;
}
.bg-eee{
	background-color: #f4f4f4;
}
.bg-current-flow{
	background-color: #dbeeff;
}
.ui-sortable-helper {
    display: table;
}
.ui-state-highlight { height: 2.5em; line-height: 2.2em; margin-bottom:10px; background-color: #ffce7e !important;}
.my-accordion-header{cursor: pointer;}

input::placeholder {
    color: #ccc !important;
    opacity: 0.5; /* Firefox */
}
.btn-accordion-header{
	border-top: none;
    border-bottom: none;
    border-left: none;
    border-right: 1px solid #000000;
}
.music_panel{
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: space-evenly;
    align-items: center;
    gap: 20px;
    margin: 10px 0px;
}
.music_panel_audio_controls{
	width: 400px;
}
.music_item_name{

}

.button-top-menu{
    background: var(--navy-mid);
    padding: 5px 0px;
    /*border-top: 1px solid #5a99d0;
    margin-bottom: 10px;*/
}

.event_break{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    align-content: center;
    padding: 5px 8px;
    background: #dbeeff;
    border: 1px solid #828282;
    border-radius: 5px;
    font-weight: 600;
}

/* ── Accordion shell ── */
.sport-accordion {
    border-radius: 16px;
    overflow: hidden;
    border: 1.5px solid var(--border-cream);
    box-shadow: 0 4px 24px rgba(28,26,23,.06);
    margin-bottom: 10px;
}
.sport-accordion:last-child{
    margin-bottom: 0;
}
/* ── Accordion header (top button) ── */
.sport-accordion .accordion-button {
    background: var(--white);
    font-family: 'Unbounded', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: var(--ink);
    padding: 1.1rem 1.5rem;
    border-bottom: 1.5px solid var(--border-cream);
    gap: .75rem;
    transition: background .2s;
}
.sport-accordion .accordion-button:not(.collapsed) {
    background: var(--ivory);
    color: var(--terracotta-dark);
    box-shadow: none;
}
.sport-accordion .accordion-button::after {
    filter: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23C9704A'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.sport-accordion .accordion-button:focus {
    box-shadow: 0 0 0 3px rgba(201,112,74,.18);
}

.acc-badge {
    background: var(--blush-mid);
    color: var(--terracotta-dark);
    font-family: 'Manrope', sans-serif;
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .03em;
    padding: .25rem .7rem;
    border-radius: 999px;
    border: 1px solid rgba(201,112,74,.25);
}
.acc-badge-detail {
    background: var(--terracotta-light);
    color: var(--terracotta-dark);
    font-family: 'Manrope', sans-serif;
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .03em;
    padding: .25rem .7rem;
    border-radius: 999px;
    border: 1px solid rgba(201,112,74,.25);
}

/* ── Body ── */
.sport-accordion .accordion-body {
    background: var(--cream);
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* ── Year card ── */
.year-card {
    background: var(--white);
    border: 1.5px solid var(--border-cream);
    border-radius: 12px;
    overflow: auto;
    transition: box-shadow .2s;
}


.year-card-header {
    background: var(--ivory);
    border-bottom: 1.5px solid var(--border-cream);
    padding: .7rem 1.1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}
.year-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--ink);
    letter-spacing: .04em;
    margin: 0;
}

.year-card-tools { display: flex; gap: .35rem; }


/* ── Table ── */
.sport-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .9rem;
}
.sport-table caption {
    caption-side: top;
    background: linear-gradient(90deg, var(--terracotta-light) 0%, var(--ivory) 100%);
    color: var(--terracotta-dark);
    font-family: 'Unbounded', sans-serif;
    font-size: .85rem;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: .55rem 1rem;
    border-bottom: 1.5px solid var(--border-cream);
    text-align: left;
}
.sport-table thead th {
    background: var(--ivory);
    border-bottom: 1.5px solid var(--border-cream);
    padding: .55rem .85rem;
    font-weight: 600;
    color: var(--muted);
    font-size: .73rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap;
}
.sport-table tbody tr {
    border-bottom: 1px solid var(--sand);
    transition: background .15s;
}
.sport-table tbody tr:last-child { border-bottom: none; }
.sport-table tbody tr:hover { background: var(--ivory); }
.sport-table td {
    padding: .5rem .5rem;
    vertical-align: middle;
    color: var(--ink);
}
.sport-table td:first-child {
    color: var(--muted);
    font-size: .75rem;
    font-weight: 600;
}

.td-name { font-size: 1rem; }

.pill {
    display: inline-block;
    border-radius: 6px;
    padding: .2rem .55rem;
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .03em;
}
.pill-rank {
    background: var(--ivory);
    color: var(--ink);
    border: 1px solid var(--border-cream);
}
.pill-cat {
    background: var(--terracotta-light);
    color: var(--terracotta-dark);
    border: 1px solid rgba(201,112,74,.2);
}
.pill-no-music {
    background: var(--sand);
    color: var(--muted);
    border: 1px solid var(--border-cream);
}

.edit-link {
    display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px;
    background: var(--ivory);
    border: 1px solid var(--border-cream);
    border-radius: 7px;
    color: var(--muted);
    text-decoration: none;
    transition: background .15s, color .15s;
    font-size: .9rem;
}
.edit-link:hover { background: var(--terracotta-light); color: var(--terracotta-dark); }

/* Состояния ячейки */
.cell-saving { background: #fff8e1; transition: background .2s; }
.cell-saved   { background: #e8f5e9; transition: background .3s; }
.cell-error   { background: #ffebee; transition: background .3s; }

[class*="td-"]:not(:has(input)):not(:has(select)) {
    cursor: pointer;
}
[class*="td-"]:not(:has(input)):not(:has(select)):hover {
    background: #f5f5f5;
}

/* Редакторы */
.cell-input {
    width: 100%;
    min-width: 80px;
    padding: 2px 6px;
    border: 1px solid var(--terracotta, #c0714f);
    border-radius: 4px;
    font-size: inherit;
    font-family: inherit;
    outline: none;
    background: #fff;
    box-sizing: border-box;
}
.cell-input--wide { min-width: 180px; }
.cell-input--year { max-width: 80px; }

.cell-select {
    padding: 2px 4px;
    border: 2px solid var(--terracotta, #c0714f);
    border-radius: 4px;
    font-size: inherit;
    font-family: inherit;
    outline: none;
    background: #fff;
}
.cell-input--date--2 {
    padding: 2px 6px;
    border: 2px solid var(--terracotta, #c0714f);
    border-radius: 4px;
    font-size: inherit;
    font-family: inherit;
    outline: none;
    background: #fff;
    min-width: 140px;
}

.final-protocol-panel{
    background: #ecf7ff;
    margin-top: -20px;
    display: flex;
    padding: 5px 14px;
    gap: 15px;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
    border-bottom: 1px solid #356da4;
}
.navbar-collapse{
    justify-content: center;
}
.bg-success {
    --bs-bg-opacity: 1;
    background-color: #258f86 !important;
}
.section_view_program{
    display: flex;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 2rem;
    justify-content: flex-start;
}
.accordion-button.protocol_left_panel_accordion_header{
    border: none;
    box-shadow: none;
}
.activity_show_accordion{
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    /* gap: 2px;*/
}
.scores_wrapper{
    margin-top: 0.5rem;
}
.scores_detail_block{
    display: flex;
    gap: 0.5rem;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    margin-bottom: 15px;
    padding: 6px 12px;
}
.score_item{
    flex: 1;
    text-align: center;
}

.judge_score_block{
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    flex-direction: row;
    align-content: center;
    justify-content: center;
    align-items: center;
    background: var(--border-light);
    padding: 12px 6px;
    border-top: 1px solid var(--border-cream);
}

.groups_block{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--border-warm);
    border-radius: 5px;
    background: var(--navy);
    color: var(--white);
    overflow: hidden;

}

.total_score_item_bloc.groups_block{

}
.groups_block .groups_block_label{
    text-align: center;
    /* height: auto; */
    padding: 2px 10px;
    font-weight: 600;
    min-width: 90px;
    font-size: 0.9rem;
}
.groups_block .groups_block_value{
    padding: 2px;
    background: var(--border-cold);
    flex: 1;
    font-weight: 600;
    font-size: 1.2rem;
    min-width: 65px;
    color: #000000;
    text-align: center;
    width: 100%;
}
.groups_block_value.has_value{
    background: var(--scored);
    color: #fff;
}
.groups_block_value.bg-sbavki{
    background: var(--danger);
    color: #fff;
}

#score-toast-container {
    position: fixed;
    top: 24px;
    right: 24px;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 360px;
}

.score-toast {
    background: #fff;
    border-radius: 10px;
    padding: 5px 10px 10px 10px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
    display: flex;
    flex-direction: column;
    gap: 5px;
    animation: scoreToastIn .3s cubic-bezier(.4, 0, .2, 1);
    border-top: 2px solid;
}

.score-toast.score-toast--approve {
    border-color: #10b981;
    background: #d1fae5f2;
}
.score-toast__athlete{
    font-size: 20px;
}
.score-toast.score-toast--reject {
    border-color: #ef4444;
    background: #ffd9d9f2;
}

/* Header */
.score-toast__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.score-toast__title-group {
    display: flex;
    align-items: center;
    gap: 10px;
}

.score-toast__icon {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    font-weight: bold;
    flex-shrink: 0;
}

.score-toast--approve .score-toast__icon {
    background: #10b981;
}

.score-toast--reject .score-toast__icon {
    background: #ef4444;
}

.score-toast__title {
    font-weight: 700;
    font-size: 15px;
}

.score-toast--approve .score-toast__title {
    color: #059669;
}

.score-toast--reject .score-toast__title {
    color: #dc2626;
}

.score-toast__close-x {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 20px;
    color: #9ca3af;
    line-height: 1;
    padding: 0;
    flex-shrink: 0;
}

.score-toast__close-x:hover {
    color: #6b7280;
}

/* Body */
.score-toast__body {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.score-toast__field {
    display: flex;
    flex-direction: column;
    /* gap: 1px; */
    flex-wrap: wrap;
    align-content: space-around;
    justify-content: center;
    align-items: center;
}
.toast_item_wrapper{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: space-evenly;
    align-items: center;
}
.score-toast__label {
    font-size: 12px;
    color: #000000;
    text-transform: uppercase;
    letter-spacing: .4px;
}

.score-toast__field strong {
    text-align: center;
}
.score-toast__item{
    font-size: 25px;
}
.score-toast__score {
    font-size: 25px !important;
}

.score-toast--approve .score-toast__score {
    color: #059669 !important;
}

.score-toast--reject .score-toast__score {
    color: #dc2626 !important;
}

/* Footer */
.score-toast__footer {
    display: flex;
    gap: 8px;
}

.score-toast__btn-display,
.score-toast__btn-close {
    flex: 1;
    border-radius: 7px;
    padding: 8px 10px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    border: none;
}

.score-toast__btn-display {
    color: #fff;
}

.score-toast--approve .score-toast__btn-display {
    background: #10b981;
}

.score-toast--reject .score-toast__btn-display {
    background: #ef4444;
    display: none;
}

.score-toast__btn-display:hover {
    opacity: .88;
}

.score-toast__btn-close {
    background: #fff;
    color: #374151;
    border: 1px solid #d1d5db !important;
}

.score-toast__btn-close:hover {
    background: #f3f4f6;
}

@keyframes scoreToastIn {
    from { opacity: 0; transform: translateX(60px); }
    to   { opacity: 1; transform: translateX(0); }
}

@keyframes scoreToastOut {
    from { opacity: 1; transform: translateX(0); }
    to   { opacity: 0; transform: translateX(60px); }
}
.athletes-list{
    display: flex;
    gap: 25px;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: stretch;
    align-items: stretch;
}
.athlete-block{
    border: 1px solid var(--border);
    border-top: 3px solid var(--navy-light);
    border-radius: 10px;
    overflow: hidden;
}
.name_block{
    background: var(--border-light);
    padding: 0px 10px 5px;
    border-bottom: 1px solid var(--border-cream);
    text-align: center;
}
.name_block .athlete-name{
    font-size: 25px;
    font-weight: 600;
    color: var(--navy-mid);
    white-space: nowrap;
    flex-shrink: 0;
}
.name_block.bg-current-athlete{
    color: #ffffff;
    background-color: #258f86;
}
.name_block.bg-current-athlete .athlete-name{
    color: #ffffff;
}
.name_block span{
    font-size: 0.875em;
}
.btn-show-score {
    background: none;
    border: 1px solid var(--bs-danger);
    color: var(--bs-danger);
}

.btn-show-score:hover {
    background: var(--bs-code-color);
    border: 1px solid var(--bs-danger);
    color: #FFFFFF;
}
.btn-show-score.score_showed {
    background: var(--scored);
    border: 1px solid var(--bs-danger);
    color: #FFFFFF;
}
.btn-show-score.score_showed:hover {
    background: var(--bs-code-color);
    border: 1px solid var(--bs-danger);
    color: #FFFFFF;
}
.btn-show-score.score_unshowed {
    background: var(--bs-danger);
    border: 1px solid var(--bs-danger);
    color: #FFFFFF;
}

.card-athlete-ctrl {
    padding: 6px 12px;
    border-bottom: 1px solid var(--ivory-dark);
    display: flex;
    align-items: center;
    /* gap: 6px; */
    background: #FFFFFF;
    justify-content: space-between;
    flex-wrap: wrap;
    flex-direction: row;
}
.ctrl-right {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}
.vline { width: 1px; height: 20px; background: var(--sand); flex-shrink: 0; margin: 0 3px; }
.btn-outline-secondary {
    --bs-btn-color: var(--navy);
    --bs-btn-border-color: var(--navy-mid);
    --bs-btn-hover-bg: var(--navy-mid);
    --bs-btn-active-bg: var(--navy-light);
}
.dropdown-menu {
    --bs-dropdown-link-active-bg: var(--navy-light);
    --bs-dropdown-link-hover-color: #ffffff;
}
.dropdown-item:hover, .dropdown-item:focus
{
    color: var(--bs-dropdown-link-hover-color);
    background-color: var(--navy);
}
.dropdown-item:hover.text-success
{
    color: var(--bs-dropdown-link-hover-color) !important;
    background-color: var(--scored);
}

.dropdown-item:hover.text-danger
{
    color: var(--bs-dropdown-link-hover-color) !important;
    background-color: var(--danger);
}

.r-panel-name-athlete{
    display: flex;
    align-content: center;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: flex-start;
    align-items: baseline;
}
/************ judge info ********************/
.ac-wrap {
    display: grid;
    grid-template-columns: 1fr 250px;
    gap: 12px;
    padding: 1rem 1rem;
    font-size: 14px;
    color: var(--text-dark);
    font-family: sans-serif;
    background: var(--ivory);
    border: 1px solid var(--border);
    border-top: 3px solid var(--navy-light);
    border-radius: 10px;
}

.ac-left {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ac-header {
    background: var(--warm-white);
    border: 1px solid var(--border-cold);
    border-radius: 8px;
    padding: 14px 18px;
    box-shadow: var(--shadow-card);
}

.ac-header h1 {
    margin: 0 0 4px;
    font-size: 25px;
    font-weight: 500;
    color: var(--navy-mid);
    line-height: 1.3;
}

.ac-header p {
    margin: 0;
    font-size: 12px;
    color: var(--text-mid);
}

.ac-actions {
    display: flex;
    gap: 10px;
}

.ac-btn {
    padding: 15px 20px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
    border: none;
    cursor: pointer;
    flex: 1;
    line-height: 1;
}

.ac-btn-navy {
    background: var(--navy);
    color: #fff;
}

.ac-btn-navy:hover {
    background: var(--navy-hover);
}

.ac-btn-green {
    background: var(--success);
    color: #fff;
}

.ac-btn-green:hover {
    background: var(--scored-dk);
}

.ac-disciplines {
    background: var(--warm-white);
    border: 1px solid var(--border-cold);
    border-radius: 8px;
    padding: 16px;
    box-shadow: var(--shadow-card);
}

.ac-disc-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    position: relative;
}

.ac-disc-btn {
    padding: 10px 8px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
    border: 1px solid var(--border-cold);
    background: var(--ivory);
    color: var(--navy);
    cursor: pointer;
    text-align: center;
    transition: background 0.15s;
}

.ac-disc-btn:hover {
    background: #e8edf3;
}

.ac-bottom {
    display: flex;
    gap: 10px;
    align-items: stretch;
    align-content: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.ac-btn-navy-sm {
    background: var(--navy);
    color: #fff;
    padding: 10px 16px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    flex: 1;
}

.ac-btn-navy-sm:hover {
    background: var(--navy-hover);
}

.ac-btn-outline {
    background: var(--warm-white);
    color: var(--navy);
    padding: 10px 16px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
    border: 1px solid var(--border-cold);
    cursor: pointer;
    flex: 1;
    text-align: center;
    display: block;
}

.ac-btn-outline:hover {
    background: var(--success);
    color: #FFFFFF;
}

.ac-right {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex-wrap: wrap;
    align-items: stretch;
    align-content: stretch;
}

.ac-score-panel {
    background: var(--muted);
    border: 1px solid var(--border-cold);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: var(--shadow-card);
}
.ac-score-panel.approved_scores {
    background: var(--scored);
    border: 1px solid var(--border-cold);
}

.ac-score-header {
    padding: 10px 14px;
    text-align: center;
}

.ac-score-header span {
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    letter-spacing: 0.05em;
}

.ac-score-apparatus {
    background: var(--navy-mid);
    padding: 8px 14px;
    text-align: center;
}

.ac-score-apparatus span {
    font-size: 14px;
    font-weight: 500;
    color: #fff;
}

.ac-score-label {
    background: var(--ivory);
    text-align: center;
    border-bottom: 1px solid var(--border-cold);
}

.ac-score-label span {
    font-size: 11px;
    color: var(--text-mid);
    font-weight: 500;
    letter-spacing: 0.05em;
}

.ac-score-value {
    padding: 10px;
    text-align: center;
}

.ac-score-value span {
    font-size: 40px;
    font-weight: 500;
    color: #fff;
}

.ac-btn-announce {
    background: var(--scored-dk);
    color: #fff;
}

.ac-btn-announce:hover {
    background: var(--scored);
}

.ac-btn-screen {
    background: var(--warm-white);
    color: #b07a10;
    border: 1px solid var(--accent-amber);
}

.ac-btn-screen:hover {
    background: #fffbf0;
}

.ac-btn-delete {
    background: var(--danger-light);
    color: var(--danger);
    border: 1px solid var(--danger-border);
}

.ac-btn-delete:hover {
    background: #fae2e0;
}
.ac-disc-label {
   /* padding: 10px 8px; */
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
    border: 1px solid var(--border-cold);
    background: var(--ivory);
    color: var(--navy);
    cursor: pointer;
    text-align: center;
    transition: background 0.15s;
    width: 100%;
    margin: 0;
    height: 50px;
    display: flex;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}

.ac-disc-label:hover {
    background: #e8edf3;
}

.btn-check-item {
    position: absolute;
    clip: rect(0, 0, 0, 0);
    pointer-events: none;
}

.btn-check-item:checked + .ac-disc-label {
    background: var(--navy);
    color: #fff;
    border-color: var(--navy);
}

.btn-check-item:checked + .ac-disc-label.ac-active {
    background: var(--success);
    color: #FFFFFF;
    border-color: var(--accent-green)
}

.ac-disc-label.ac-active {
    background: var(--muted);
    color: #FFFFFF;
    border-color: #000000;
}
.btn-check-item:checked + .ac-disc-label.ac-approve {
    background: var(--success);
    color: #FFFFFF;
    border-color: var(--accent-green)
}

.ac-disc-label.ac-approve {
    background: var(--scored);
    color: #FFFFFF;
    border-color: var(--accent-green)
}

.athlete-empty-out{
    background: var(--text-muted);
    color: #fff;
    text-align: center;
    flex: 1;
    display: flex;
    flex-direction: row;
    align-content: center;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    font-size: 1rem;
    border-radius: 10px;
}

.btn-cntr-group{
    display: flex;
    align-items: center;
    gap: 5px;
}
.send_control_btn{
    display: flex;
}
.send_control_btn .playbtn {
    border-left: none;
    border-radius: 0 4px 4px 0;
}
.send_control_btn .remove_from_tablet{
    border-radius: 4px 0 0 4px;
}
.list-athlete .name{
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    cursor: default;
}
.ui-dialog-buttonset button{
    padding: 2px 5px;
    border-radius: 4px;
    border: 1px solid #ccc;
    background: #edf4ff;
}
.ui-dialog-buttonset button:hover{
    background: #e2ecff;
}
.ui-draggable .ui-dialog-titlebar{
    background: #387ef0;
    border-color: #89b6ff;
    color: #ffffff;
}