/* COLORS - START*/
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover ,
.page-sidebar .page-sidebar-menu>li.active.open>a, .page-sidebar .page-sidebar-menu>li.active>a, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li.active.open>a, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li.active>a,
.page-sidebar .page-sidebar-menu>li.active.open>a:hover, .page-sidebar .page-sidebar-menu>li.active>a:hover, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li.active.open>a:hover, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li.active>a:hover,
.timetable-week .timetable-column .timetable-column-header, a.list-group-item:hover, button.list-group-item:hover, .plan-button a, .list-toggle:hover, .list-toggle:hover span, .tiva-timetable .timetable-list .timetable-header,
.btn-link:hover, .no-link:hover .light {    
    background-color: #1BBC9B;
    border-color: #1BBC9B;
}
a, a:hover, a:visited, .profile-desc-link i, .btn-link,
.pagination>li>a, .pagination>li>span {
    color: #1BBC9B;
}
.btn-link:hover {
    color: #ffffff;
}
.login {
    background-color: #e9e9e9;
}
/* COLORS - END*/

.page-header.navbar .page-logo .logo-default {
    margin-top: 8px;
    max-height: 35px;
    max-width: 150px;
}
button .fa, a .fa {
    padding-right: 3px;
}
/* An icon-only button has no text after its icon (owner, 2026-10-13) */
.btn-icon-only .fa {
    padding-right: 0px;
}
.input-xs {
    font-size: 12px !important;
    height: 20px;
    padding-top: 3px;
    padding-bottom: 3px;
}
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
    vertical-align: middle;
}
.table td, .table th {
    font-size: 11px;
    font-weight: 500;
}
.table thead tr th {
    font-size: 13px;
}
/* A confirmation modal rendered inside a table cell (the squad rows carry
   their own, so a row added over ajax brings its modal along) keeps the
   body font, not the cell's small one (owner, 2026-09-28) */
.table td .modal-content {
    font-size: 13px;
    font-weight: 400;
}
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
    padding: 6px;
}
.table .btn {
    font-weight: 500;
}
/* Buttons, labels and inputs at the sportclub-3 sizes, so the admin reads
   the same everywhere (owner, 2026-09-23). The row buttons of a listing are
   .btn-circle at 11px; the theme's own colour classes stay. */
.btn {
    font-size: 13px !important;
}
.btn-xs {
    font-size: 11px !important;
}
.control-label {
    font-weight: 500 !important;
    font-size: 13px !important;
}
.form-control, output {
    font-size: 13px;
}
.select2-results__option {
    padding: 5px;
    font-size: 13px;
}
.select2-container .select2-selection--single .select2-selection__rendered {
    font-size: 13px;
}
h4 {
    font-size: 15px;
    font-weight: 500 !important;
}

.admin-popup-overlay {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0,0,0,0.8);
    z-index: 9;
}

.admin-custom-popup {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    padding: 15px;
    width: 650px;
    height: 570px;
    background-color: #fff;
    border: 1px solid #aaa;
    font-family: sans-serif;
}

.admin-custom-popup .header {
    overflow: hidden;
}
.admin-custom-popup .header .title {
    float: left;
    max-width: 288px;
}
.admin-custom-popup .header .close {
    float: right;
    max-width: 40px;
    cursor: pointer;
}

.admin-custom-popup .content {
    padding: 20px 0;
    height: 500px;
}

.admin-custom-popup  .gallery-name-input {
    padding: 8px;
    width: 99%;
    margin-bottom: 30px;
}
.admin-custom-popup  .galleries-autocomplete {
    padding: 0;
    max-height: 400px;
    overflow: auto;
    list-style: none;
}
.admin-custom-popup  .galleries-autocomplete li {
    padding: 5px 0;
    border-bottom: 1px solid #eee;
    cursor: pointer;
}
.admin-custom-popup  .galleries-autocomplete li.selected {
    background-color: #eee;
    border-bottom-color: #aaa;
}

.admin-custom-popup .footer {
    overflow: hidden;
}
.admin-custom-popup .footer .ok {
    float: right;
    height: 28px;
    background-color: #2d8ac7;
    border: 1px solid transparent;
    color: #fff;
    cursor: pointer;
}
.admin-custom-popup .footer .cancel {
    float: right;
    margin-left: 5px;
    height: 28px;
    background-color: #f0f0f0;
    border: 1px solid transparent;
    color: #333;
    cursor: pointer;
}

@keyframes fadeIn {
    from { opacity: 0; }
}


.image-row-success {
    width: 100%;
    padding: 10px;
    text-align: center;
    background: green;
    color: white;
    animation: fadeIn 1s alternate;
    -webkit-animation-iteration-count: 2; /* Safari 4.0 - 8.0 */
    animation-iteration-count: 2;
}
.image-row-fail {
    width: 100%;
    padding: 10px;
    text-align: center;
    background: red;
    color: white;
    animation: fadeIn 1s alternate;
    -webkit-animation-iteration-count: 2; /* Safari 4.0 - 8.0 */
    animation-iteration-count: 2;
}
.portlet.light .form .form-actions.top, .portlet.light .portlet-form .form-actions.top {
    padding: 15px 15px 0px 15px;
    border-bottom: 0px;
    background-color: #f3f3f3;
    border: 1px solid #e7ecf1;
}
/* No margin (owner, 2026-10-13) */
.btn-icon-only {
    width: 38px;
    height: 32px;
    margin: 0px;
}
/* The search button of a listing (sportclub-3): a thin line and a caret
   after the label, each 10px after the one before */
.dropdown-toggle {
    font-weight: 500;
}
.dropdown-toggle span {
    margin: 0px 0px 0px 6px;
}
.vertical-line {
    display: inline-block;
    border-left: 1px solid #fff;
    vertical-align: middle;
    height: 19px;
    margin: 0px 0px 0px 10px !important;
}
@media (max-width: 768px) {
    .input-large {
        width: 260px !important;
    }
}
.dropdown-menu>li>a {
    padding: 5px 0px 5px 8px;
    margin: 0px;
}
.dropdown-menu>li>a>img {
    width:20px;
}


/* CHANGE FONTS */
body, p, span, h1, h2, h3, h4, h5, h6 {
    font-family: "Montserrat",sans-serif;
}
.page-sidebar .page-sidebar-menu>li>a, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li>a {
    font-size: 13px;
}
.page-sidebar .page-sidebar-menu>li>a>i, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li>a>i {
    font-size: 14px;
}
.page-sidebar .page-sidebar-menu>li.active>a, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li.active>a {
    font-size: 13px;
}
.page-sidebar .page-sidebar-menu>li>a {
    padding: 4px 15px;
}
.page-sidebar .page-sidebar-menu>li.heading {
    padding: 13px 10px 8px 10px;
}
.page-sidebar .page-sidebar-menu>li.heading>h3, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li.heading>h3 {
    color: #eee;
    font-weight: 400;
}

.page-sidebar .page-sidebar-menu>li.open>a, .page-sidebar .page-sidebar-menu>li:hover>a, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li.open>a, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li:hover>a {
    font-size: 13px;    
}
.page-sidebar .page-sidebar-menu .sub-menu>li>a, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu>li>a {
    font-size: 13px;
}
.alert {
    bottom: 3% !important;
}

.profile-desc-title {
    color: #5a7391 !important;
}
.page-sidebar-menu>li.heading>h3 {
    font-size: 13px !important;
}
a.list-group-item:hover, button.list-group-item:hover, .list-group-item:hover h4, .list-group-item:hover [class^="icon-"], .list-group-item:hover p {
    color: #fff;
}
.dashboard-stat2 {
    border: 1px solid #f2784b;
    background-color: #f3f4f6!important;
}
.note.note-warning {
    padding-right: 100px;
}
.dashboard-stat2 .display .icon>i,
.dashboard-stat2 .progress-info .status,
.dashboard-stat2 .display .number small,
.profile-desc-title {
    color: #5a7391 !important;
}
.plan-button a:hover {
    color: #5a7391;
}
.plan-type {
    padding: 10px 15px;
    color: #fff;
    font-size: 15px;
    text-transform: uppercase;
    font-weight: 600;
    margin: 10px 0px 10px 0px;
}
.plan-button {
    padding: 20px 0px 20px 0px;
    text-align: center;
}
.plan-button a {
    text-transform: uppercase;
    color: #fff;
    font-weight: 600;
}
.plan-button a:hover {
    background-color: #fff!important;
}
.plan-type [class^="icon-"] {
    padding-right: 5px;
}
.dashboard-stat {
    border: 1px solid #ddd;
}
.dashboard-stat2 .display .icon>i,
.dashboard-stat2 .progress-info .status,
.dashboard-stat2 .display .number small {
    color: #5a7391 !important;
}
.dashboard-stat2 {
    border: 1px solid #ddd;
}
.dashboard-stat2, .dashboard-stat2 .display {
    margin-bottom: 10px;
}
.dashboard-stat2 {
    padding: 10px 15px 25px 15px
}
.dashboard-stat {
    margin-bottom: 15px;
}
.limit_exhausted [class^="icon-"], .limit_exhausted h4, .limit_exhausted .list-group-item-text {
    color: #e7505a !important;
}
.limit_exhausted {
    background-color: #fbe1e3 !important;
}
.list-toggle:hover {
    border-bottom: 1px solid #fff;
}
.form .form-body, .portlet-form .form-body {
    padding: 0px;
}
@media (min-width: 992px){
    .page-content-wrapper .page-content {
        padding: 20px 20px 10px;
    }
}
@media (min-width: 992px) {
    .col-first {
        padding-right: 5px;
    }
    .col-middle {
        padding-right: 5px;
        padding-left: 5px;
    }
    .col-last {
        padding-left: 5px;
    }
}
.page-bar {
    visibility: hidden;
    display: none;
}
.page-content-white .page-title {
    margin: 0px 0px 15px 0px !important;
}
.page-title {
    font-size: 1.5em !important;
}
/* The sidebar, the content offset and the logo box in the header are one
   width, so the sidebar toggler (it floats right inside .page-logo) sits on
   the sidebar's edge. The theme has 235px for all three; edit.css used to
   narrow only the sidebar, which left the toggler 35px past it. */
@media (min-width: 992px) {
    .page-sidebar {
        width: 220px;
    }
    .page-content-wrapper .page-content {
        margin-left: 220px;
    }
    .page-header.navbar .page-logo {
        width: 220px;
    }
    .login .content .form-title {
        font-weight: 300;
        margin-bottom: 15px;
    }
}
.list-logo {
    height: 25px;
}
.social-generate {
    font-size: 20px;
    line-height: 20px;
    margin-top: 4px;
}
.thumbnail a>img, .thumbnail>img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
}
.feeds li .col1 {
    font-size: 13px;
}
.feeds li .col2>.date {
    color: #82949a;
}
.alert {
    border-width: 1px;
    margin: 20px 20px 20px 20px;
    position: fixed;
    max-width: 89%;
    min-width: 30%;
    bottom: 0%;
    right: 0%;
    z-index: 9999;
}
@media (min-width: 991px) {
    .alert {

    }
}
.feeds li .col2 {
    font-size: 12px;
}
a.list-group-item .list-group-item-heading, button.list-group-item .list-group-item-heading, .profile-desc-link a, .card-title span {
    color: #5a7391 !important;
}
.card-icon i {
    font-size: 35px;
    border: 1px solid #ecf0f4;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    padding: 35px 26px;
    background-color: #fff;
    border: 1px solid #ddd;
    margin: 20px 0;
}
.card-title {
    margin-bottom: 20px;;
}
.no-link:hover {
    text-decoration: none;
}
.profile-desc-link a {
    font-weight: 500;
}
@media (max-width: 991px) {
    .ordering {
        display: none;
    }
}
.note p, .page-loading, .panel .panel-body {
    font-size: 14px;
}
.mt-checkbox, .mt-radio {
    margin-bottom: 5px;
    font-size: 13px;
}


.login-eye-btn {
    border: 1px solid #ACB5C3;
}

.login .login-eye-btn .btn, .login .login-eye-btn .btn-default {
    padding: 10px 15px !important;
}

.login-eye-btn button .fa, .login-eye-btn button a .fa {
    padding-right: 0px;
}

.login .content .form-control {
    height: 44px;
}
.remember_me span {
    border: 1px solid #ACB5C3 !important;
    background-color: #f9f9f9 !important;
}

.login .content .rememberme {
    margin-bottom: 20px;
}
/* SUPPORT (admin/support) - the house support styles, same as sportclub-3
   and nerotour: the floating help button, the ticket list row and the
   comment form. The speed-dial actions above the button carry their own
   inline style in backend/support/button.blade.php. */
.phone-call {
    opacity: .9;
    width: 75px;
    height: 75px;
    right: 20px;
    bottom: 20vh;
    background: #157E53;
    position: fixed;
    text-align: center;
    color: #fff;
    cursor: pointer;
    border-radius: 50% !important;
    display: inline-block;
    border: 2px solid #fff;
    z-index: 3;
    -webkit-transition: opacity .2s ease-in-out;
    -moz-transition: opacity .2s ease-in-out;
    transition: opacity .2s ease-in-out;
}
@media (min-width: 769px) {
    .phone-call {
        bottom: 9vh;
    }
}
.phone-call:hover {
    opacity: 1;
}
@keyframes pulse-phone {
    0% {
        transform: scale(0);
        opacity: 0;
    }
    25% {
        transform: scale(.3);
        opacity: 1;
    }
    50% {
        transform: scale(.6);
        opacity: .6;
    }
    75% {
        transform: scale(.9);
        opacity: .3;
    }
    100% {
        transform: scale(1);
        opacity: 0;
    }
}
.phone-call:before {
    position: absolute;
    content: " ";
    z-index: -1;
    top: -15px;
    left: -15px;
    background-color: #157E53;
    width: 100px;
    height: 100px;
    border-radius: 100%;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    opacity: .6;
    -webkit-animation: pulse-phone 1.8s ease-out;
    animation: pulse-phone 1.8s ease-out;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
.phone-call img {
    height: 60%;
    width: 60%;
    margin: 14px 0 0 1px;
}
.phone-call span {
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s, opacity .3s linear;
}
.phone-call img {
    visibility: visible;
    opacity: 1;
    transition: visibility 0s, opacity .4s linear;
}
.phone-call:hover span {
    visibility: visible;
    opacity: 1;
    font-size: 11px;
    text-transform: uppercase;
    left: 8px;
    top: 29px;
    font-weight: 600;
    position: absolute;
}
.phone-call:hover img {
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s, opacity .4s linear;
}
.phone-call-unread, .phone-call-unread:before {
    background: #e35b5a !important;
}
/* The unread state on hover (owner, 2026-10-05): the number and the
   "Нови отговори" text centred in the circle and wrapping inside it -
   the text used to run out of the 75px circle */
.phone-call-unread:hover span {
    left: 4px;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    line-height: 1.1;
}
.unread-comments-number {
    margin: 0;
    line-height: 1;
    font-size: 1.6rem !important;
}
.unread-comments-text {
    margin: 2px 0 0;
    line-height: 1.1;
    font-size: 9px;
    white-space: normal;
}
.chat-form {
    padding: 0px;
    margin: 10px 0px;
}
/* Dropzone theme of the support form. The bundled dropzone.min.css is the
   plain library; these are the Metronic .dropzone-default rules that
   sportclub-3 carries in its own (newer) dropzone.css, taken over here so
   the box looks the same without mixing two versions of the plugin. */
.dropzone.dropzone-default {
    min-height: auto;
    text-align: center;
    cursor: pointer;
    border: 2px dashed #EBEDF3;
    border-radius: 0.42rem;
    margin-bottom: 10px;
}
.dropzone.dropzone-default .dropzone-msg-title {
    color: #3F4254;
    margin: 0 0 5px 0;
    padding: 0;
    font-weight: 500;
    font-size: 1.2rem;
}
.dropzone.dropzone-default .dropzone-msg-desc {
    color: #B5B5C3;
    font-weight: 400;
    font-size: 1rem;
}
.dropzone.dropzone-default .dz-preview .dz-image {
    border-radius: 0.42rem;
}
.dropzone.dropzone-default .dz-error-message {
    top: 145px;
}
.dropzone.dropzone-default .dz-remove {
    color: #7E8299;
    font-size: 1.2rem;
    margin-top: 5px;
    font-weight: 500;
    -webkit-transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease;
    transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease;
}
.dropzone.dropzone-default .dz-remove:hover {
    color: #c7254e;
}
.dropzone.dropzone-default.dropzone-primary {
    border-color: #3699FF;
}

/* Help center icon in the admin header (backend/common/user_menu.blade.php).
   Its <a> is the only child of the <li>, so the theme's rule
   ".navbar-nav > li.dropdown > .dropdown-toggle:last-child { padding-right: 0 }"
   (assets/layouts/layout/css/layout.css) strips the right padding and the
   icon sticks to the support one next to it. Support keeps its padding only
   because its <a> is followed by a .dropdown-menu. Put the theme's own
   10px back so the two sit the same way. */
.page-header.navbar .top-menu .navbar-nav > li.dropdown.manual-header-link > .dropdown-toggle:last-child {
    padding-right: 10px;
}

/* The header and the burger on a phone: sportclub-3's rules as they are
   (owner, 2026-09-23 - the mobile menu 1:1). The grey burger lines, the
   toggler offsets, the avatar size, and below 480px the header menu stays
   in the bar instead of dropping onto the second row the theme expects
   with "page-header-fixed-mobile". The user name is hidden by the theme
   itself below 580px (username-hide-on-mobile), as in sportclub. */
.page-header.navbar .menu-toggler>span,
.page-header.navbar .menu-toggler>span:before,
.page-header.navbar .menu-toggler>span:after {
    background: #bfbfbf;
}
.page-header.navbar .menu-toggler.responsive-toggler {
    margin: 18px 6px 0;
}
.page-header .top-menu .dropdown-quick-sidebar-toggler>.dropdown-toggle {
    padding: 18px 10px 12px !important;
}
.page-header.navbar .top-menu .navbar-nav>li.dropdown {
    padding: 0px;
}
.page-header.navbar .top-menu .navbar-nav>li.dropdown-user .dropdown-toggle {
    background-color: inherit;
}
.page-header.navbar .top-menu .navbar-nav>li.dropdown-user .dropdown-toggle>img {
    height: 35px;
    width: 35px;
    display: inline-block;
    margin: -8px 0px 0px 5px;
}
.page-header.navbar .top-menu .navbar-nav>li.dropdown-extended .dropdown-menu {
    width: 500px;
    max-width: 98vw;
    position: absolute;
}
.page-header.navbar .top-menu .navbar-nav>li.dropdown-extended .dropdown-menu .dropdown-menu-list>li>a {
    padding: 15px 10px 15px;
}
@media (max-width: 767px) {
    .page-header.navbar .top-menu .navbar-nav>li.dropdown-notification .dropdown-menu {
        margin-right: -89px;
    }
}
@media (max-width: 480px) {
    .page-header.navbar .top-menu {
        display: inherit;
        clear: inherit;
        float: inherit;
        background-color: inherit;
    }
}

/* On a 320-359px phone (iPhone SE and friends) the logo, the three icons
   and the burger are about 25px wider than the bar, and the menu wraps
   again. Trim the logo there, not the icons - the icons are the tap
   targets. */
@media (max-width: 359px) {
    .page-header.navbar .page-logo img.logo-default {
        max-height: 26px;
    }
}

/* Pictures in listings and previews (owner, 2026-09-23, after sportclub-3
   admin/newss and admin/players). Two classes, because both are reused:
   .admin-thumb for a rectangular image (news, articles), .admin-avatar for
   a face (users). Fixed box + object-fit keep every row the same height;
   the border colour is the theme colour and lives in the inline colour
   block of backend/common/header.blade.php. */
.admin-thumb, .admin-avatar {
    object-fit: cover;
    border: 1px solid #ccc;
    background-color: #fff;
}
.admin-thumb {
    width: 100px;
    height: 50px;
}
.admin-thumb.admin-thumb-lg {
    width: 200px;
    height: 100px;
}
.admin-avatar {
    width: 50px;
    height: 50px;
    -webkit-border-radius: 50% !important;
    -moz-border-radius: 50% !important;
    border-radius: 50% !important;
}
.admin-avatar.admin-avatar-lg {
    width: 120px;
    height: 120px;
}
/* A logo or an icon in the avatar circle (teams, awards, positions, event
   types - owner, 2026-09-28): the picture whole inside the circle, not
   cropped to it */
.admin-avatar.admin-avatar-logo {
    object-fit: contain;
    padding: 3px;
}
/* THE INLINE EDITORS of the rows (owner, 2026-10-08; inline-edit.js,
   instead of X-editable in Мачове and Състави): the value is a link with
   a dashed underline at rest; on hover (and while its editor is open) a
   light blue ground, a solid line and the blue text. Long text is cut
   with an ellipsis, so a new value never widens its column. */
.inline-x,
.inline-x:focus {
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom;
    padding: 0 3px;
    margin: 0 -3px;
    line-height: 1.35;
    border-radius: 3px;
    border-bottom: 1px dashed #9fb4c8;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}
.inline-x:hover,
.inline-x.inline-x-open {
    background-color: #e3eefa;
    border-bottom: 1px solid #3598dc;
    color: #3598dc;
    text-decoration: none;
}
.inline-x.inline-x-empty {
    color: #9aa5b1;
    letter-spacing: 0.5px;
}
.inline-x.inline-x-empty:hover,
.inline-x.inline-x-empty.inline-x-open {
    color: #3598dc;
}
/* The number of Състави (the cell of sportclub-3's stats-spin-input): the
   value centred in a fixed width between two pale arrows, so neither the
   digit nor the row moves when it changes or its bubble opens */
.inline-x.inline-x-spin {
    min-width: 4.2em;
    text-align: center;
    font-weight: 700;
}
.inline-x.inline-x-spin:before,
.inline-x.inline-x-spin:after {
    font-family: FontAwesome;
    font-weight: normal;
    font-size: 10px;
    color: #c3cad1;
}
.inline-x.inline-x-spin:before {
    content: "\f0d9";
    margin-right: 6px;
}
.inline-x.inline-x-spin:after {
    content: "\f0da";
    margin-left: 6px;
}
/* The squad table keeps its columns whatever a position is (owner,
   2026-10-08): the widths of the head; a long name is cut in its button */
.squad-table-desktop {
    table-layout: fixed;
}
.squad-table-desktop .btn {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* The running number of a squad row: small and pale grey, a different look
   from the player's number (owner, 2026-10-12) */
.squad-table-desktop > tbody > tr > td.squad-index-cell {
    text-align: center;
    vertical-align: middle;
    font-size: 12px;
    color: #b0b7c0;
}
/* The same on the phone table, before the pencil */
.squad-table-mobile .squad-index-mobile {
    display: inline-block;
    min-width: 18px;
    margin-right: 4px;
    text-align: center;
    vertical-align: middle;
    font-size: 12px;
    color: #b0b7c0;
}
/* The pencil to the player's edit form: the icon alone, as the pencil of
   Мачове, centred both ways in its cell (owner, 2026-10-09) */
.squad-table-desktop > tbody > tr > td.squad-edit-cell {
    text-align: center;
    vertical-align: middle;
}
.squad-table .squad-icon-edit {
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    color: #f2784b;
}
.squad-table .squad-icon-edit:hover {
    text-decoration: none;
    opacity: 0.75;
}
.squad-table-mobile .squad-icon-edit {
    margin-right: 6px;
    vertical-align: middle;
}
/* The number of a player bigger at rest (owner, 2026-10-09); on the phone
   the "№" before it is as big as the number */
.squad-table .inline-x.inline-x-spin,
.squad-table .squad-number,
.squad-table .squad-number-label {
    font-size: 15px;
}
.squad-table .squad-number-label {
    font-weight: 700;
}
/* The outcome of a save: green when the server took it, red when it
   refused it - the colour stays about a second and a half and fades
   (owner, 2026-10-07) */
.inline-flash-ok {
    animation: inline-flash-ok 1.6s ease-out;
}
.inline-flash-bad {
    animation: inline-flash-bad 1.6s ease-out;
}
@keyframes inline-flash-ok {
    0% { background-color: transparent; }
    10% { background-color: #26c281; color: #fff; }
    75% { background-color: #26c281; color: #fff; }
    100% { background-color: transparent; }
}
@keyframes inline-flash-bad {
    0% { background-color: transparent; }
    10% { background-color: #e7505a; color: #fff; }
    25% { background-color: transparent; }
    40% { background-color: #e7505a; color: #fff; }
    75% { background-color: #e7505a; color: #fff; }
    100% { background-color: transparent; }
}
/* The compact menu under the value: the current entry ticked, a filter
   field above a long list */
.inline-menu {
    position: fixed;
    z-index: 10060;
    min-width: 190px;
    max-width: 290px;
    background: #fff;
    border: 1px solid #e1e5ec;
    border-radius: 4px;
    box-shadow: 0 6px 24px rgba(30, 40, 55, 0.16), 0 1px 3px rgba(30, 40, 55, 0.12);
    overflow: hidden;
    font-size: 13px;
    text-align: left;
}
.inline-menu-filter {
    display: block;
    width: 100%;
    padding: 8px 10px;
    border: 0;
    border-bottom: 1px solid #e1e5ec;
    outline: none;
    font-size: 13px;
}
.inline-menu-list:focus {
    outline: none;
}
.inline-menu-list {
    max-height: 240px;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 4px 0;
}
.inline-menu-item {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 6px 12px 6px 8px;
    border: 0;
    background: none;
    color: #2f353b;
    text-align: left;
    cursor: pointer;
}
.inline-menu-item.active,
.inline-menu-item:focus {
    background-color: #e3eefa;
    outline: none;
}
.inline-menu-item.is-current {
    font-weight: 600;
}
.inline-menu-check {
    flex: 0 0 18px;
    color: #3598dc;
    font-size: 11px;
}
.inline-menu-text {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.inline-menu-item.inline-menu-none {
    color: #9aa5b1;
}
/* The heading of a section of the menu (the referees and the delegates
   of Мачове: the tournament's city, the account's other cities, Други) */
.inline-menu-group {
    padding: 8px 12px 3px 8px;
    color: #8896a6;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .3px;
}
.inline-menu-group:not(:first-child) {
    margin-top: 4px;
    border-top: 1px solid #eef1f5;
}
.inline-menu-empty {
    padding: 8px 12px;
    color: #9aa5b1;
    font-size: 12px;
}
/* The time grid: four columns, the red Отложен and the two fields of
   "Друг час" under it */
.inline-menu.inline-times {
    width: 290px;
    max-width: 290px;
}
.inline-times-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
    /* Every time visible, no scroll (owner, 2026-10-08) */
    overflow: visible;
    padding: 8px;
}
.inline-times-chip {
    padding: 5px 0;
    border: 1px solid #e1e5ec;
    border-radius: 3px;
    background: #fff;
    color: #2f353b;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    cursor: pointer;
}
.inline-times-chip:hover,
.inline-times-chip.active,
.inline-times-chip:focus {
    border-color: #3598dc;
    outline: none;
}
.inline-times-chip.is-current {
    background-color: #3598dc;
    border-color: #3598dc;
    color: #fff;
}
.inline-times-foot {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 8px;
    border-top: 1px solid #e1e5ec;
}
.inline-times-postpone {
    padding: 4px 10px;
    border: 1px solid #e7505a;
    border-radius: 3px;
    background: #fff;
    color: #e7505a;
    font-weight: 600;
    cursor: pointer;
}
.inline-times-postpone:hover,
.inline-times-postpone.is-current {
    background-color: #e7505a;
    color: #fff;
}
/* "Друг" on the last row of the grid, in the columns the chips leave free
   (owner, 2026-10-08): a chip with a red frame that opens the two fields
   and the green tick that saves */
.inline-times-other-cell {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    min-width: 0;
}
.inline-times-other-cell .inline-times-other-chip {
    flex: 0 0 auto;
    min-width: 25%;
    padding-left: 8px;
    padding-right: 8px;
    border-color: #e7505a;
    color: #e7505a;
}
.inline-times-other-cell .inline-times-other-chip:hover,
.inline-times-other-cell .inline-times-other-chip:focus,
.inline-times-other-cell .inline-times-other-chip.is-open {
    background-color: #e7505a;
    border-color: #e7505a;
    color: #fff;
}
/* The tick is outlined and fills only while pressed; the grey X folds the
   fields back (owner, 2026-10-08) */
.inline-times-save,
.inline-times-cancel {
    margin-left: 2px;
    padding: 4px 6px;
    border: 1px solid #26c281;
    border-radius: 3px;
    background: #fff;
    color: #26c281;
    cursor: pointer;
}
.inline-times-save:focus,
.inline-times-cancel:focus {
    outline: none;
}
.inline-times-save:active {
    background-color: #26c281;
    color: #fff;
}
.inline-times-cancel {
    border-color: #b5bfc9;
    color: #8c9aa8;
}
.inline-times-cancel:hover,
.inline-times-cancel:active {
    background-color: #e1e5ec;
    color: #5c6b7a;
}
/* Друга дата next to Отложен (owner, 2026-10-08): blue, the same shape */
.inline-times-date {
    margin-left: auto;
    padding: 4px 10px;
    border: 1px solid #3598dc;
    border-radius: 3px;
    background: #fff;
    color: #3598dc;
    font-weight: 600;
    cursor: pointer;
}
.inline-times-date:hover,
.inline-times-date:focus {
    background-color: #3598dc;
    color: #fff;
    outline: none;
}
.inline-times-hm {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}
.inline-times-hm b {
    color: #6f7d8a;
}
.inline-times-hm input {
    width: 2.6em;
    padding: 4px 0;
    border: 1px solid #e1e5ec;
    border-radius: 3px;
    outline: none;
    text-align: center;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}
.inline-times-hm input:focus {
    border-color: #3598dc;
}
.inline-times-hm input.has-error {
    border-color: #e7505a;
}
/* A phone: the menu and the grid are a sheet at the bottom */
.inline-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 10059;
    background: rgba(0, 0, 0, 0.35);
}
.inline-menu.inline-sheet {
    left: 0 !important;
    right: 0;
    top: auto !important;
    bottom: 0;
    width: auto;
    max-width: none;
    border-radius: 12px 12px 0 0;
    padding-bottom: env(safe-area-inset-bottom, 0px);
}
.inline-sheet-title {
    padding: 12px 16px 6px;
    font-weight: 700;
    font-size: 14px;
}
.inline-menu.inline-sheet .inline-menu-list {
    max-height: 55vh;
}
.inline-menu.inline-sheet .inline-menu-item {
    padding: 11px 16px 11px 12px;
    font-size: 15px;
}
.inline-menu.inline-sheet .inline-menu-filter {
    padding: 11px 16px;
    font-size: 15px;
}
.inline-menu.inline-sheet .inline-times-grid {
    max-height: 45vh;
}
.inline-menu.inline-sheet .inline-times-chip {
    padding: 10px 0;
    font-size: 14px;
}
/* The number bubble of sportclub-3 (stats-spin-input): 80px over the
   cell - the up button, the value, the down button */
.inline-spin {
    position: fixed;
    z-index: 10060;
    width: 80px;
    display: flex;
    flex-direction: column;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.12), 0 6px 20px rgba(0, 0, 0, 0.16);
    touch-action: none;
    transform: scale(0.88);
    opacity: 0;
    transition: transform 0.11s ease, opacity 0.11s ease;
}
.inline-spin.active {
    transform: scale(1);
    opacity: 1;
}
.inline-spin-btn {
    width: 100%;
    padding: 5px 0;
    border: 0;
    background-color: #525e64;
    color: #fff;
    font-size: 11px;
    cursor: pointer;
}
.inline-spin-btn:hover {
    filter: brightness(1.12);
}
.inline-spin-btn:active {
    filter: brightness(0.88);
}
.inline-spin input {
    width: 100%;
    padding: 4px;
    border: 0;
    border-top: 1px solid #eef0f2;
    border-bottom: 1px solid #eef0f2;
    outline: none;
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    color: #2d3748;
}
@media (max-width: 768px) {
    .inline-spin-btn {
        padding: 10px 0;
    }
}
/* The reason of a refusal, under the value */
.inline-tip {
    position: fixed;
    z-index: 10061;
    max-width: 280px;
    padding: 5px 9px;
    border-radius: 3px;
    background: #e7505a;
    color: #fff;
    font-size: 12px;
    pointer-events: none;
}
/* A logo (partners, banners): the height only, the width follows the
   image, nothing is cropped (owner, 2026-09-23) */
.admin-logo {
    height: 20px;
    width: auto;
    border: 1px solid #ccc;
    background-color: #fff;
}
.admin-logo.admin-logo-lg {
    height: 60px;
}

/* Montserrat for the tooltips and the placeholders too (owner, 2026-09-23).
   Bootstrap's .tooltip names Helvetica outright, and a placeholder does not
   inherit the font of the field in every browser. */
.tooltip, .tooltip-inner, .dropdown-menu {
    font-family: "Montserrat", sans-serif;
}
/* The search dropdown (.dropdown-menu) and every field in it: the theme's
   components.min.css names Helvetica on .dropdown-menu, sportclub-3 patched
   that file to Montserrat and its bootstrap.min.css to the grey 2px field
   border. The same look from here, without touching the theme files. */
.form-control {
    border: 1px solid #ACB5C3;
    border-radius: 2px !important;
    padding: 5px 10px;
}
.form-control,
.select2-container--bootstrap .select2-selection--multiple .select2-search--inline .select2-search__field,
.select2-container--bootstrap .select2-selection--single {
    background-color: #f9f9f9 !important;
}
.form-control::-webkit-input-placeholder,
.select2-search__field::-webkit-input-placeholder {
    font-family: "Montserrat", sans-serif;
}
.form-control::-moz-placeholder,
.select2-search__field::-moz-placeholder {
    font-family: "Montserrat", sans-serif;
}
.form-control:-ms-input-placeholder,
.select2-search__field:-ms-input-placeholder {
    font-family: "Montserrat", sans-serif;
}
.form-control::placeholder,
.select2-search__field::placeholder {
    font-family: "Montserrat", sans-serif;
}
.select2-container .select2-selection__placeholder {
    font-family: "Montserrat", sans-serif;
}

/* Sidebar sections (backend/common/menu.blade.php, owner 2026-09-23): the
   rules of sportclub-3's edit.css as they are, same selectors, so the
   menu reads the same - the section heading folds its group, the entries
   sit in a .sub-menu. Only the colour of the active entry differs: it is
   the theme colour and lives in the inline colour block of
   header.blade.php, sportclub hard-codes its orange. */
.nav-item [class*=" fa-"], .nav-item [class*=" glyphicon-"], .nav-item [class*=" icon-"], .nav-item [class^=fa-], .nav-item [class^=glyphicon-], .nav-item [class^=icon-] {
    padding-right: 0px;
}
.menu-section-title {
    color: #eee;
    font-weight: 400;
}
.menu-section .nav-link {
    padding: 10px 10px 8px 10px !important;
}
.menu-section a {
    border-top: 1px solid #484848;
    color: #d9d9d9 !important;
}
.menu-section i {
    color: #888;
    margin-left: 1px;
    margin-right: 4px;
}
.sub-menu .nav-item a {
    padding: 4px 15px !important;
}
.sub-menu {
    margin: 0px !important;
}
.menu-section.open > .nav-link .arrow {
    transform: rotate(90deg);
    transition: transform 0.2s;
}
.sub-menu {
    display: none;
}
.sub-menu a:hover {
    background: #303030;
    color: #d9d9d9;
}
.sub-menu .active a {
    color: #ffffff !important;
}
.sub-menu .active a i {
    color: #ffffff !important;
}
.page-sidebar .page-sidebar-menu .sub-menu>li:hover>a {
    background-color: #303030 !important;
}
.sub-menu .nav-item:hover > a i {
    color: #888 !important;
}
.sub-menu .nav-item.active:hover > a {
    color: #fff !important;
}
.sub-menu .nav-item.active:hover > a i {
    color: #fff !important;
}
@media (max-width: 991px) {
    .page-sidebar, .page-sidebar.in {
        margin: 10px 10px !important;
    }
}

/* A field with buttons after it (the username and password fields of the
   account forms, backend/common/credentials.blade.php). Scoped to
   .credentials-group: the theme's plain .input-group wraps selects too. */
.input-group.credentials-group {
    display: flex;
    align-items: center;
}
.input-group.credentials-group .form-control {
    flex: 1;
}
.input-group.credentials-group .input-group-append {
    display: flex;
}
.input-group.credentials-group .input-group-append .btn {
    width: 40px;
    height: 34px;
    border-top: 1px solid #ACB5C3 !important;
    border-bottom: 1px solid #ACB5C3 !important;
}
.input-group.credentials-group .input-group-append .btn:last-child {
    border-right: 1px solid #ACB5C3 !important;
}

/* The ordering cell of a listing (sportclub-3): rounded number field,
   bold arrows */
.ordering input[type="submit"] {
    padding: 0 6px;
}
.ordering-arrow, .ordering button[type="submit"] {
    font-size: 1.25rem !important;
    font-weight: 800 !important;
    padding: 0 4px;
}
.ordering .form-control {
    border-radius: 10px !important;
    padding-top: 3px;
    text-align: center;
}

/* The letters strip above a listing (backend/common/letter_bar.blade.php,
   after sportclub-3's letter-slider): scrolls sideways when the letters do
   not fit - a finger drag on a phone (native scroll, no scrollbar), the
   arrows on a desktop. The arrows appear only with .has-overflow, which
   the script in footer.blade.php sets when there is something to scroll;
   the icon sits dead centre and is big enough to see. */
.letter-slider-container {
    position: relative;
    overflow: hidden;
    width: 100%;
}
.letter-slider {
    display: flex;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.letter-slider::-webkit-scrollbar {
    display: none;
}
.letter-slider .btn {
    flex: 0 0 auto;
    white-space: nowrap;
}
.letter-slider-container.has-overflow .letter-slider {
    padding-left: 30px;
}
.letter-slider-container.has-overflow .letter-slider a:last-child {
    margin-right: 30px;
}
.slider-arrow {
    display: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 26px;
    height: 34px;
    align-items: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.5);
    color: #fff !important;
    font-size: 22px;
    line-height: 1;
    border: none;
    cursor: pointer;
    z-index: 10;
    text-decoration: none !important;
}
.slider-arrow:hover, .slider-arrow:focus {
    background-color: rgba(0, 0, 0, 0.7);
    color: #fff !important;
    text-decoration: none !important;
}
.slider-arrow .fa {
    padding: 0;
}
.letter-slider-container.has-overflow .slider-arrow {
    display: flex;
}
.slider-arrow.left {
    left: 0;
}
.slider-arrow.right {
    right: 0;
}

/* "The access data is copied" under the copy button (users): the line is
   always there (visibility, not display), so nothing jumps */
.credentials-copy-message {
    min-height: 20px;
    margin-top: 5px;
    color: green;
    visibility: hidden;
}

/* A required field: the label carries "required-label" and the red star
   comes from CSS (sportclub-3), not from the label text */
.required-label:after {
    content: ' *';
    color: #e7505a;
    font-weight: bold;
}

/* A modal body that scrolls inside the modal (the squads and the
   duplicates of a player): the page behind keeps one scrollbar */
.modal-body-scroll {
    max-height: 65vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* The logo box of the team form (teams/edit): the 200 x 150 crest as the
   site draws it, whole, on the box, never cropped */
.team-logo-preview {
    width: 200px;
    height: 150px;
    line-height: 146px;
    text-align: center;
}
.team-logo-preview img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    vertical-align: middle;
}

/* A team's crest (listing and preview): a circle at the size of the
   players' photo, the whole logo inside it, nothing cropped (owner,
   2026-09-25) */
.team-crest {
    width: 50px;
    height: 50px;
    object-fit: contain;
    background-color: #fff;
    border: 1px solid #ccc;
    padding: 3px;
    -webkit-border-radius: 50% !important;
    -moz-border-radius: 50% !important;
    border-radius: 50% !important;
}
.team-crest.team-crest-lg {
    width: 120px;
    height: 120px;
    padding: 8px;
}

/* The three medal counts of a team (listing and preview), with air
   between them */
.team-medals > span {
    display: inline-block;
    margin: 0 4px;
    white-space: nowrap;
}
/* In the teams listing the counts sit under the name (owner, 2026-09-27),
   flush left with it */
td > .team-medals {
    margin-top: 4px;
}
td > .team-medals > span:first-child {
    margin-left: 0;
}

/* Listings with a home city (teams, playgrounds - owner, 2026-09-25): the
   account's own rows come first, then one divider row, then the rows of
   the other cities, slightly faded (opacity 0.9 on the whole row) */
.table > tbody > tr.row-divider > td {
    background-color: #e9edf2 !important;
    color: #5c6b7a;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.5px;
    padding: 4px 8px;
}
.table > tbody > tr.row-foreign > td {
    opacity: 0.9;
}


/* Outlined badges in the theme colours (owner, 2026-09-27), the admin's
   way to mark a value in a listing or a preview: danger for cities, the
   key column of Статистики and the permissions of a role; warning for
   nicknames, teams, contact names and banner zones; primary for the
   numbers of Статистики, positions and user roles; info for phones, e-mails and
   system numbers; default for dates */
.badge.badge-border-primary,
.badge.badge-border-default,
.badge.badge-border-info,
.badge.badge-border-success,
.badge.badge-border-danger,
.badge.badge-border-warning {
    background: #fff;
    font-weight: 600;
    margin: 1px 2px 1px 0;
}
.badge.badge-border-primary {
    border: 1px solid #3598dc;
    color: #3598dc;
}
.badge.badge-border-default {
    border: 1px solid #95a5a6;
    color: #7f8c8d;
}
.badge.badge-border-info {
    border: 1px solid #659be0;
    color: #659be0;
}
.badge.badge-border-success {
    border: 1px solid #26c281;
    color: #26c281;
}
.badge.badge-border-danger {
    border: 1px solid #ed6b75;
    color: #ed6b75;
}
.badge.badge-border-warning {
    border: 1px solid #e7a300;
    color: #e7a300;
}

/* The permissions grid (backend/common/permissions_grid, roles form and
   the roles / users previews): one bootstrap panel per category, coloured
   by the menu section of its module, the header carries the group's own
   "Всички"; the outline checkboxes read red when off and green when on -
   the design of the sportclub-3 user form (owner, 2026-09-27) */
.permissions-group {
    margin-bottom: 15px;
}
.permissions-group > .panel-heading {
    padding: 8px 15px;
}
.permissions-group__title {
    margin: 0;
    font-weight: 600;
    text-transform: uppercase;
}
.permissions-group__label {
    margin: 0;
    padding-left: 28px;
    font-size: 13px;
    text-transform: none;
}
.permissions-group > .panel-body {
    padding: 10px 15px 0;
}
.permissions-group .mt-checkbox-inline {
    padding: 0;
}
.permissions-group .mt-checkbox {
    margin-bottom: 10px;
}
.permissions-group .mt-checkbox.mt-checkbox-outline > span,
.permissions-group .mt-checkbox.mt-checkbox-outline > input:focus ~ span,
.permissions-group .mt-checkbox.mt-checkbox-outline:hover > input:not([disabled]) ~ span {
    background: #E08283;
}
.permissions-group .mt-checkbox > input:checked ~ span,
.permissions-group .mt-checkbox:hover > input:not([disabled]):checked ~ span {
    background: #d6e9c6 !important;
}
.permissions-group .permissions-group__locked {
    opacity: 0.75;
}
.permissions-group__list .permissions-group__item {
    display: inline-block;
    margin: 0 15px 10px 0;
    font-size: 13px;
    white-space: nowrap;
}
/* A permission the role does not give (the previews list every one:
   green check on the granted, red cross on the rest) */
.permissions-group__list .permissions-group__item--missing {
    color: #999;
}

/* Мачове (admin/fixtures, owner 2026-09-28, task 21). One heading row per
   day; the rows of one start time within the day sit together and a
   separator line opens the next start time (owner, 2026-10-02: instead
   of the colours by time) */
.table > tbody > tr.fixture-day > td {
    background-color: #2f353b !important;
    color: #e9edf2;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 5px 8px;
}
.fixtures-table > tbody > tr.fixture-time-break > td {
    border-top: 2px solid #6b7886;
}
/* The groups of one start time alternate white and grey (a stripe by time,
   owner 2026-10-02); a postponed match is a pale yellow row, a service
   match a pale red one (the colours of the outlined badges) */
.fixtures-table > tbody > tr.fixture-stripe > td {
    background-color: #f4f6f8;
}
.fixtures-table > tbody > tr.fixture-postponed > td {
    background-color: rgba(231, 163, 0, 0.1);
}
.fixtures-table > tbody > tr.fixture-service > td {
    background-color: rgba(237, 107, 117, 0.12);
}
/* A played match (a result, or a service result) fades, so the ones still
   to play stand out; it brightens on hover and stays editable - the inline
   editors open outside the row (owner, 2026-10-06) */
.fixtures-table > tbody > tr.fixture-played > td {
    opacity: .55;
}
.table-hover.fixtures-table > tbody > tr.fixture-played:hover > td {
    opacity: 1;
}
/* The hover of a row: a light blue on EVERY row, a postponed or a service
   one included, so it reads over their own colours (owner, 2026-10-05).
   !important, because the theme's .table-hover rule carries one (grey
   #f3f4f6); the opaque colour beats the pale row backgrounds */
.table-hover.fixtures-table > tbody > tr.fixture-row:hover > td,
.table-hover.fixtures-table > tbody > tr.fixture-row.fixture-postponed:hover > td,
.table-hover.fixtures-table > tbody > tr.fixture-row.fixture-service:hover > td {
    background-color: #d6e6fb !important;
}
/* The rows (owner, 2026-09-30 and 2026-10-01): everything centred; the
   playground under the time, the tournament under the round, the delegate
   under the referee */
.fixtures-table > thead > tr > th,
.fixtures-table > tbody > tr > td {
    text-align: center;
    padding: 3px;
}
.fixtures-table > tbody > tr.fixture-row > td {
    vertical-align: middle;
}
.fixtures-table .fixture-cell-sub {
    margin-top: 3px;
    font-size: 12px;
    color: #6f7d8a;
}
.fixtures-table .fixture-cell-round .fixture-round-name {
    font-weight: 600;
}
/* On a desktop the referee and the delegate (one over the other) sit left
   (owner, 2026-10-04) */
@media (min-width: 768px) {
    .fixtures-table > tbody > tr.fixture-row > td.fixture-cell-officials {
        text-align: left;
    }
}
.fixtures-table .fixture-official-label {
    display: inline-block;
    width: 14px;
    color: #9aa5b1;
    text-align: center;
}
/* The match line: "Отбор 1  2 - 1  Отбор 2", the dash always in the middle
   of the cell, the home side right-aligned to it, the away side
   left-aligned (owner, 2026-10-01); a dash alone without a result */
.fixtures-table .fixture-match {
    display: flex;
    align-items: center;
    color: #2f353b;
    font-weight: 600;
}
.fixtures-table .fixture-match .fixture-half {
    flex: 1 1 0;
    min-width: 0;
}
.fixtures-table .fixture-match .fixture-half-home {
    text-align: right;
}
.fixtures-table .fixture-match .fixture-half-away {
    text-align: left;
}
.fixtures-table .fixture-match .fixture-dash {
    flex: 0 0 18px;
    text-align: center;
    font-weight: 700;
}
.fixtures-table .fixture-match .badge.fixture-score {
    min-width: 24px;
    margin: 0;
    padding: 2px 6px;
    font-weight: 700;
    text-align: center;
}
/* The actions of a row: the icon alone, no button frame */
.fixtures-table .fixture-icon-form {
    display: inline;
    margin: 0;
}
.fixtures-table .fixture-icon {
    display: inline-block;
    padding: 0;
    border: 0;
    background: none;
    font-size: 16px;
    line-height: 1;
    color: #8c9aa8;
    cursor: pointer;
}
.fixtures-table .fixture-icon:hover {
    text-decoration: none;
    opacity: 0.75;
}
/* The eye blinks like an edited value (.inline-flash-ok / -bad) */
.fixtures-table .fixture-icon {
    border-radius: 3px;
}
.fixtures-table .fixture-icon-on { color: #26a69a; }
.fixtures-table .fixture-icon-off { color: #e7505a; }
.fixtures-table .fixture-icon-facebook { color: #8c9aa8; opacity: 0.7; }
.fixtures-table .fixture-icon-share { color: #1877f2; }
/* The grey "f" of a row whose city has no connected page: a link for an
   account with fixture_facebook_connect (owner, 2026-10-05) */
.fixtures-table a.fixture-icon-connect { color: #8c9aa8; }
.fixtures-table a.fixture-icon-connect:hover { color: #1877f2; opacity: 1; }
.fixtures-table .fixture-icon-invalid { color: #e7a300; }
.fixtures-table .fixture-icon-edit { color: #f2784b; }
.fixtures-table .fixture-icon-print { color: #8c9aa8; }
.fixtures-table .fixture-icon-history { color: #67809f; }
/* An action that is not wired yet (the pencil, owner 2026-10-05) */
.fixtures-table .fixture-icon-disabled,
.fixtures-table .fixture-icon-disabled:hover {
    opacity: 0.45;
    cursor: not-allowed;
}
.fixtures-table .fixture-icon-muted {
    color: #c3ccd5;
    cursor: default;
}
/* Плащания (owner, 2026-10-09): the money icon by a team and by an
   official - red unpaid, green paid; a button without a frame, as the
   icons of the actions */
.fixtures-table .fixture-pay {
    display: inline-block;
    padding: 0 3px;
    border: 0;
    border-radius: 3px;
    background: none;
    font-size: 14px;
    line-height: 1;
    vertical-align: middle;
    cursor: pointer;
}
.fixtures-table .fixture-pay:hover {
    opacity: 0.75;
}
.fixtures-table .fixture-pay-due { color: #e7505a; }
.fixtures-table .fixture-pay-paid { color: #26a69a; }
/* No amount in the tournament (owner, 2026-10-09): grey, opens nothing */
.fixtures-table .fixture-pay-none { color: #c3ccd5; cursor: default; }
.fixtures-table .fixture-pay-none:hover { opacity: 1; }
.fixtures-table .fixture-official .fixture-pay {
    flex: 0 0 auto;
    margin-left: 2px;
}
/* The Плащане modal: the well of the amount (the "дължи" modal of
   sportclub-3) - the big amount, the pencil, the input in place */
#fixture-pay-modal .fixture-pay-well {
    padding: 14px 12px;
    margin-bottom: 15px;
    border: 1px solid #ccc;
}
/* No title over the amount (owner, 2026-10-09): the big number alone */
/* The view and the edit of the amount are one fixed box, the content
   centred in it, so Коригирай сумата never stretches the well and nothing
   under it jumps (owner, 2026-10-09) */
#fixture-pay-modal .fixture-pay-view,
#fixture-pay-modal .fixture-pay-edit {
    display: flex;
    flex-direction: column;
}
#fixture-pay-modal .fixture-pay-value {
    font-size: 28px;
    font-weight: 700;
    line-height: 40px;
    color: #2f353b;
}
#fixture-pay-modal .fixture-pay-well:not(.fixture-pay-well-paid) .fixture-pay-value {
    cursor: pointer;
}
#fixture-pay-modal .fixture-pay-well-paid .fixture-pay-value {
    color: #26a69a;
}
#fixture-pay-modal .fixture-pay-actions {
    margin-top: 6px;
    line-height: 20px;
}
#fixture-pay-modal .fixture-pay-gap {
    display: inline-block;
    width: 20px;
}
/* The field with its two arrows on the right, one above the other (owner,
   2026-10-09: the phone has no wheel) */
#fixture-pay-modal .fixture-pay-input-wrap {
    position: relative;
    flex: 0 0 auto;
    width: 200px;
    max-width: 100%;
    margin: 0 auto;
}
#fixture-pay-modal .fixture-pay-step {
    position: absolute;
    right: 1px;
    width: 34px;
    height: 19px;
    padding: 0;
    border: 0;
    border-left: 1px solid #c2cad8;
    background-color: #f1f4f7;
    color: #5e6b78;
    font-size: 16px;
    line-height: 19px;
    cursor: pointer;
}
#fixture-pay-modal .fixture-pay-step-up {
    top: 1px;
    border-bottom: 1px solid #c2cad8;
}
#fixture-pay-modal .fixture-pay-step-down {
    bottom: 1px;
}
#fixture-pay-modal .fixture-pay-step:hover,
#fixture-pay-modal .fixture-pay-step:active {
    background-color: #e3eefa;
    color: #3598dc;
}
#fixture-pay-modal .fixture-pay-input {
    width: 100%;
    height: 40px;
    padding-right: 38px;
    padding-left: 38px;
    font-size: 20px;
    font-weight: 700;
}
#fixture-pay-modal .fixture-pay-well.has-error .fixture-pay-input {
    border-color: #e7505a;
}
/* The date under the well: a line, the calendar opens in place on a click
   (owner, 2026-10-09) */
#fixture-pay-modal .fixture-pay-date-group {
    position: relative;
    margin-bottom: 15px;
}
/* The line of the date keeps its look while the calendar is open: the
   input of the picker is an invisible layer over the line, there only to
   place the calendar under it (owner, 2026-10-09) */
#fixture-pay-modal .fixture-pay-date-view {
    height: 34px;
    line-height: 34px;
}
#fixture-pay-modal .fixture-pay-date-open {
    color: #2f353b;
}
#fixture-pay-modal .fixture-pay-date-edit {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 34px;
    opacity: 0;
    pointer-events: none;
}
#fixture-pay-modal .fixture-pay-date-edit .fixture-pay-date {
    max-width: 180px;
    height: 34px;
    margin: 0 auto;
}
/* Общо (owner, 2026-10-12): the switch with its count over the well, the
   sum in the well without the pencil, the matches of the sum under it */
#fixture-pay-modal .fixture-pay-total-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-bottom: 10px;
}
#fixture-pay-modal .fixture-pay-total-label {
    margin: 0;
    font-weight: 600;
    cursor: pointer;
}
#fixture-pay-modal .fixture-pay-well-total .fixture-pay-value {
    cursor: default;
}
#fixture-pay-modal .fixture-pay-total-list {
    margin-bottom: 15px;
}
#fixture-pay-modal .fixture-pay-total-table {
    max-height: 220px;
    display: block;
    overflow-y: auto;
    margin-bottom: 6px;
}
#fixture-pay-modal .fixture-pay-total-table tbody {
    display: table;
    width: 100%;
}
#fixture-pay-modal .fixture-pay-total-table td {
    padding: 4px 6px;
    font-size: 13px;
    border-top: 1px solid #eef1f5;
}
#fixture-pay-modal .fixture-pay-total-table tr:first-child td {
    border-top: 0;
}
#fixture-pay-modal .fixture-pay-total-table .fixture-pay-total-date {
    white-space: nowrap;
    color: #8c96a3;
    width: 1%;
}
#fixture-pay-modal .fixture-pay-total-table .fixture-pay-total-price {
    white-space: nowrap;
    text-align: right;
    font-weight: 600;
    width: 1%;
}
#fixture-pay-modal .fixture-pay-total-note {
    margin: 0;
    text-align: center;
    font-size: 12px;
}
/* A long official's name is cut, on a phone too, never wrapped */
.fixtures-table .fixture-cell-officials .fixture-official {
    min-width: 0;
    white-space: nowrap;
}
/* The columns keep their width whatever a value is (owner, 2026-10-08):
   the editable lines take the cell's width but give the column none of
   their own (width 0, min-width 100%), so the widths of the head hold
   and a long name is cut with an ellipsis. Not table-layout: fixed - the
   day rows span the hidden tick and print columns too, and a fixed
   table turns those into an empty column at the end. */
@media (min-width: 768px) {
    .fixtures-table td.fixture-cell-time > .fixture-cell-main,
    .fixtures-table td.fixture-cell-time > .fixture-cell-sub,
    .fixtures-table td.fixture-cell-officials > .fixture-official {
        display: block;
        width: 0;
        min-width: 100%;
    }
    .fixtures-table td.fixture-cell-officials > .fixture-official {
        display: flex;
        align-items: center;
    }
    .fixtures-table .fixture-official-label {
        flex: 0 0 18px;
    }
    .fixtures-table .fixture-cell-officials .inline-x {
        min-width: 0;
    }
    .fixtures-table .fixture-playground {
        display: block;
    }
}
/* The tick column of the bulk update shows only when the switch is on */
.fixtures-wrap .fixture-bulk-col {
    display: none;
}
.fixtures-wrap.fixtures-bulk-on .fixture-bulk-col {
    display: table-cell;
}
/* The print column shows only when the Печат switch is on */
.fixtures-wrap .fixture-print-col {
    display: none;
}
.fixtures-wrap.fixtures-print-on .fixture-print-col {
    display: table-cell;
}
/* The toolbar: the bulk switch and the Word files with a gap between them;
   the cities on their own row under it */
.fixture-toolbar-cities {
    margin-bottom: 10px;
}
.fixture-toolbar .fixture-toolbar-right .btn-group {
    margin-left: 6px;
}
.fixture-facebook {
    color: #3b5998;
    font-size: 16px;
}
/* The search bar under the toolbar (owner, 2026-10-01 to 2026-10-04): on a
   desktop one row - the period and the buttons keep their size, the two
   middle pairs share the rest; under 992px every pair is a line of two
   halves: the period, tournament + team, playground + type, the buttons */
.fixture-search-bar {
    margin-bottom: 10px;
    max-width: 100%;
}
.fixture-search-bar .fixture-filter-pair {
    display: flex;
    align-items: flex-start;
    margin: 0 0 6px 0;
}
.fixture-search-bar .fixture-filter-cell {
    flex: 1 1 0;
    min-width: 0;
    margin-right: 6px;
}
.fixture-search-bar .fixture-filter-cell:last-child {
    margin-right: 0;
}
.fixture-search-bar .fixture-filter-period .input-group.input-daterange {
    display: table;
    width: 100%;
    max-width: 100%;
}
.fixture-search-bar .fixture-filter-period .input-daterange .form-control {
    width: 100%;
}
.fixture-search-bar .fixture-filter-buttons .btn {
    white-space: nowrap;
}
/* The two buttons size to their text (owner, 2026-10-07): with the shared
   "flex: 1 1 0; min-width: 0" of the cells the pair collapsed on a desktop
   and Изчистване ran past its right padding */
.fixture-search-bar .fixture-filter-buttons .fixture-filter-cell {
    flex: 1 1 auto;
    min-width: auto;
}
/* The select2 box fills its field. NOT the original <select> under it:
   select2 hides that one with .select2-hidden-accessible (1px, absolute)
   and a 100% width on it stretched the whole page sideways (2026-10-02) */
.fixture-search-bar .select2-container {
    width: 100% !important;
}
.fixture-search-bar select.form-control:not(.select2-hidden-accessible) {
    width: 100%;
}
@media (min-width: 992px) {
    .fixture-search-bar {
        display: flex;
        align-items: flex-start;
    }
    .fixture-search-bar .fixture-filter-pair {
        margin: 0 6px 0 0;
    }
    .fixture-search-bar .fixture-filter-pair:last-child {
        margin-right: 0;
    }
    .fixture-search-bar .fixture-filter-period {
        flex: 0 0 262px;
    }
    .fixture-search-bar .fixture-filter-main {
        flex: 5 1 0;
    }
    .fixture-search-bar .fixture-filter-rest {
        flex: 3 1 0;
    }
    .fixture-search-bar .fixture-filter-buttons {
        flex: 0 0 auto;
    }
}
/* Between 992 and 1199px the row is tight: the buttons keep the icon only */
@media (min-width: 992px) and (max-width: 1199px) {
    .fixture-search-bar .fixture-filter-buttons .btn span {
        display: none;
    }
}
/* The bulk box next to its switch (owner, 2026-10-04): a grey framed strip
   with Мачове (n), the new date, the status and Обнови. On a desktop it
   fills the whole room between the switch and the Word files (the toolbar
   row is a flex row from 768px up, the box its growing item; the date and
   the status share the room inside it) */
.fixture-bulk-box {
    margin-left: 6px;
    padding: 3px 6px;
    border: 1px solid #d5dde5;
    border-radius: 3px;
    background: #f4f6f8;
}
.fixture-bulk-box .fixture-bulk-group {
    white-space: nowrap;
}
.fixture-bulk-box .fixture-bulk-group .form-control {
    display: inline-block;
    vertical-align: middle;
    height: 30px;
}
.fixture-bulk-box .fixture-bulk-count {
    font-weight: 400;
    color: #5c6b7a;
}
/* The count keeps room for three digits, so the fields do not move */
.fixture-bulk-box .fixture-bulk-count #fixtures-selected {
    display: inline-block;
    min-width: 24px;
    text-align: center;
}
@media (min-width: 768px) {
    .fixture-toolbar {
        display: flex;
        align-items: flex-start;
    }
    .fixture-toolbar > div:first-child {
        flex: 1 1 auto;
        width: auto;
        min-width: 0;
    }
    .fixture-toolbar > div:last-child {
        flex: 0 0 auto;
        width: auto;
        margin-left: auto;
    }
    .fixture-toolbar > div:first-child > .form-group,
    .fixture-toolbar form.fixture-bulk {
        display: flex;
        align-items: center;
        width: 100%;
    }
    .fixture-toolbar .fixtures-bulk-toggle {
        flex: 0 0 auto;
    }
    /* The strip is as tall as the buttons next to it (33px): 25px fields
       inside a 3px padding and a 1px frame */
    .fixture-toolbar .fixture-bulk-box {
        flex: 1 1 auto;
        display: flex;
        align-items: center;
        min-width: 0;
        height: 33px;
        padding: 3px 6px;
    }
    .fixture-bulk-box .fixture-bulk-group .form-control {
        height: 25px;
        padding: 2px 6px;
        font-size: 13px;
        line-height: 19px;
    }
    .fixture-bulk-box .fixture-bulk-submit {
        height: 25px;
        padding: 2px 10px;
        line-height: 19px;
    }
    .fixture-bulk-box .fixture-bulk-group {
        flex: 0 0 auto;
        margin: 0 6px 0 0;
    }
    .fixture-bulk-box .fixture-bulk-group:last-child {
        margin-right: 0;
    }
    .fixture-bulk-box .fixture-bulk-group.tooltips,
    .fixture-bulk-box .fixture-bulk-group:nth-child(3) {
        flex: 1 1 0;
        min-width: 0;
    }
    /* The theme's .input-xsmall pins a width with !important */
    .fixture-bulk-box .fixture-bulk-date,
    .fixture-bulk-box .fixture-bulk-status {
        width: 100% !important;
    }
}
/* On a phone (owner, 2026-10-04) the box is its own full-width line under
   the switch and the Word files: the column and the form around the
   switch dissolve (display: contents), so the switch, the Word files and
   the box are the three items of the toolbar row */
@media (max-width: 767px) {
    .fixture-toolbar {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        padding: 0 15px;
        margin-bottom: 15px;
    }
    .fixture-toolbar > .col-xs-5 > .form-group {
        margin: 0;
    }
    .fixture-toolbar > .col-xs-7,
    .fixture-toolbar > .col-xs-7 > .form-group,
    .fixture-toolbar > .col-xs-7 > .form-group > form.fixture-bulk {
        display: contents;
    }
    .fixture-toolbar .fixtures-bulk-toggle {
        order: 1;
    }
    .fixture-toolbar > .col-xs-5 {
        order: 2;
        flex: 0 0 auto;
        width: auto;
        margin-left: auto;
        padding: 0;
    }
    /* Four buttons with their names on one line (Масови, Печат, Наряди,
       Сметки): a tighter padding and font on a phone */
    .fixture-toolbar .fixtures-bulk-toggle,
    .fixture-toolbar .fixture-toolbar-right .btn {
        padding-left: 7px;
        padding-right: 7px;
        font-size: 13px;
    }
    .fixture-toolbar .fixture-toolbar-right .btn-group {
        margin-left: 4px;
    }
    /* The box is four full-width lines: the count, the date, the status,
       Обнови; a margin under the grey strip */
    .fixture-toolbar .fixture-bulk-box {
        order: 3;
        flex: 0 0 100%;
        display: block;
        margin: 10px 0 0;
        padding: 8px;
        white-space: normal;
    }
    .fixture-bulk-box .fixture-bulk-group {
        display: block;
        width: 100%;
        margin: 0 0 6px;
    }
    .fixture-bulk-box .fixture-bulk-group:last-child {
        margin-bottom: 0;
    }
    .fixture-bulk-box .fixture-bulk-group .form-control,
    .fixture-bulk-box .fixture-bulk-group .btn {
        width: 100% !important;
    }
}
/* The ticks of the bulk update (iCheck minimal-blue) sit in the cell's
   middle, on a white box of their own whatever the row's colour */
.fixtures-table .fixture-bulk-col .icheckbox_minimal-blue {
    margin: 0;
    vertical-align: middle;
    background-color: #fff;
    border-radius: 2px;
}
/* The history tooltip of a row. The table wrapper must not clip it
   (Bootstrap's .table-responsive scrolls sideways at every width); the
   rows never need a sideways scroll: the widths are percentages and a
   phone gets the four-line layout */
.fixtures-wrap.table-responsive {
    overflow: visible;
}
.tooltip .fixture-history-line {
    text-align: left;
    margin-bottom: 4px;
}
.tooltip .fixture-history-line:last-child {
    margin-bottom: 0;
}
.tooltip.fixture-history-tip .tooltip-inner {
    max-width: 320px;
}
/* The rows on a phone (owner, 2026-10-04, as the live console): four lines
   per match, separated as the console's rows - the first line on a grey
   band in four equal centred columns (time, playground, round,
   tournament) with a line between them; the two teams with the score (no
   link on a phone); the referee and the delegate centred in two halves;
   the visibility, Facebook, statistics and history icons (the print one
   too with the Печат switch on). The ticks show only with the bulk
   switch on, as on a desktop. */
@media (max-width: 767px) {
    .fixtures-table,
    .fixtures-table > tbody,
    .fixtures-table > tbody > tr.fixture-day,
    .fixtures-table > tbody > tr.fixture-day > td,
    .fixtures-table > tbody > tr.fixture-empty,
    .fixtures-table > tbody > tr.fixture-empty > td {
        display: block;
        width: 100%;
    }
    .fixtures-table > thead {
        display: none;
    }
    /* Every line of the grid - between the matches, between the lines of a
       match and between the columns - is the same 1px #c9d2dc (owner) */
    /* The line between two matches is the theme's green (green-meadow,
       the admin's colour - owner, 2026-10-04), so a match stands apart */
    .fixtures-table > tbody > tr.fixture-row {
        display: flex;
        flex-wrap: wrap;
        align-items: stretch;
        padding: 0;
        border-top: 3px solid #1bbc9b;
    }
    .fixtures-table > tbody > tr.fixture-row.fixture-time-break {
        border-top: 3px solid #1bbc9b;
    }
    .fixtures-table > tbody > tr.fixture-row > td {
        display: block;
        border-top: 0 !important;
        padding: 4px 6px;
    }
    /* Line 1: the tick (with the bulk switch on) and four equal centred
       columns on a grey band, a line between them */
    .fixtures-table > tbody > tr.fixture-row > td.fixture-bulk-col {
        display: none;
        flex: 0 0 12%;
        align-items: center;
        justify-content: center;
        padding: 0;
        border-right: 1px solid #c9d2dc;
    }
    .fixtures-wrap.fixtures-bulk-on .fixtures-table > tbody > tr.fixture-row > td.fixture-bulk-col {
        display: flex;
    }
    .fixtures-table > tbody > tr.fixture-row > td.fixture-cell-time,
    .fixtures-table > tbody > tr.fixture-row > td.fixture-cell-round {
        flex: 0 0 50%;
        display: flex;
        padding: 0;
    }
    .fixtures-wrap.fixtures-bulk-on .fixtures-table > tbody > tr.fixture-row > td.fixture-cell-time,
    .fixtures-wrap.fixtures-bulk-on .fixtures-table > tbody > tr.fixture-row > td.fixture-cell-round {
        flex: 0 0 44%;
    }
    .fixtures-table > tbody > tr.fixture-row:not(.fixture-postponed):not(.fixture-service) > td.fixture-bulk-col,
    .fixtures-table > tbody > tr.fixture-row:not(.fixture-postponed):not(.fixture-service) > td.fixture-cell-time,
    .fixtures-table > tbody > tr.fixture-row:not(.fixture-postponed):not(.fixture-service) > td.fixture-cell-round {
        background-color: #e9edf2;
    }
    .fixtures-table .fixture-cell-time > .fixture-cell-main,
    .fixtures-table .fixture-cell-time > .fixture-cell-sub,
    .fixtures-table .fixture-cell-round > .fixture-cell-main,
    .fixtures-table .fixture-cell-round > .fixture-cell-sub {
        flex: 1 1 50%;
        min-width: 0;
        margin: 0;
        padding: 5px 4px 6px;
        text-align: center;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        border-right: 1px solid #c9d2dc;
        font-size: 14px;
        color: inherit;
    }
    .fixtures-table .fixture-cell-round > .fixture-cell-sub {
        border-right: 0;
    }
    /* Line 2: the teams with the score, no link on a phone */
    .fixtures-table > tbody > tr.fixture-row > td.fixture-cell-match {
        flex: 0 0 100%;
        padding: 8px 6px 9px;
        border-top: 1px solid #c9d2dc !important;
    }
    .fixtures-table .fixture-match {
        pointer-events: none;
    }
    .fixtures-table .fixture-match .fixture-team {
        display: inline-block;
        max-width: 34vw;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        vertical-align: bottom;
        font-size: 14px;
    }
    /* Line 3: the referee and the delegate, each centred in a half */
    .fixtures-table > tbody > tr.fixture-row > td.fixture-cell-officials {
        flex: 0 0 100%;
        display: flex;
        align-items: center;
        padding: 0;
        border-top: 1px solid #c9d2dc !important;
    }
    .fixtures-table .fixture-cell-officials .fixture-official {
        flex: 1 1 50%;
        padding: 4px 6px 5px;
        text-align: center;
        font-size: 14px;
    }
    .fixtures-table .fixture-cell-officials .fixture-official-referee {
        border-right: 1px solid #c9d2dc;
    }
    .fixtures-table .fixture-cell-officials .fixture-cell-sub {
        margin: 0;
        font-size: 14px;
        color: inherit;
    }
    /* The money icons on a phone (owner, 2026-10-09): at the ends of the
       line - the home team's and the referee's at the far left, the away
       team's and the delegate's at the far right - over the lines, which
       keep their centring and leave room at the ends; clickable although
       the match line takes no clicks */
    .fixtures-table > tbody > tr.fixture-row > td.fixture-cell-match {
        position: relative;
        padding-left: 28px;
        padding-right: 28px;
    }
    .fixtures-table .fixture-match .fixture-team {
        max-width: 30vw;
    }
    .fixtures-table .fixture-cell-officials .fixture-official {
        position: relative;
    }
    .fixtures-table .fixture-cell-officials .fixture-official-referee {
        padding-left: 28px;
    }
    .fixtures-table .fixture-cell-officials .fixture-official-delegate {
        padding-right: 28px;
    }
    .fixtures-table .fixture-pay {
        position: absolute;
        top: 50%;
        margin: 0;
        padding: 0;
        transform: translateY(-50%);
        pointer-events: auto;
    }
    .fixtures-table .fixture-half-home .fixture-pay,
    .fixtures-table .fixture-official-referee .fixture-pay {
        left: 8px;
    }
    .fixtures-table .fixture-half-away .fixture-pay,
    .fixtures-table .fixture-official-delegate .fixture-pay {
        right: 8px;
    }
    /* Line 4: the icons, however many there are (the eye, Оценки, Facebook,
       the pencil, the history and the print with its switch on) share one
       line equally (owner, 2026-10-09) */
    .fixtures-table > tbody > tr.fixture-row > td.fixture-cell-icon {
        flex: 1 1 0;
        min-width: 0;
        padding: 6px 2px 5px;
        border-top: 1px solid #c9d2dc !important;
    }
    .fixtures-wrap .fixtures-table > tbody > tr.fixture-row > td.fixture-print-col {
        display: none;
    }
    .fixtures-wrap.fixtures-print-on .fixtures-table > tbody > tr.fixture-row > td.fixture-print-col {
        display: block;
    }
}
/* "Виж още" under the listing */
.fixture-more-bar {
    margin-top: 10px;
    text-align: center;
}
.fixture-more-bar .fixture-more-count {
    display: block;
    margin-bottom: 6px;
}
/* The edit form: the small buttons with the times the city uses */
.fixture-time-buttons .btn {
    margin: 0 4px 4px 0;
}
/* The preview: the two teams with their logos and the score between them */
.fixture-preview-teams {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
    text-align: center;
}
.fixture-preview-team {
    flex: 1 1 0;
}
.fixture-preview-score {
    flex: 0 0 auto;
    padding: 0 10px;
    font-size: 18px;
}
.fixture-preview-score .badge {
    font-size: 16px;
    height: auto;
    padding: 4px 10px;
}
.fixture-history-title {
    margin-top: 20px;
    font-weight: 600;
}
/* Картотеки (admin/fees, owner 2026-10-03): one tile per TEAM of a player
   (the club's logo, the team with its current tournaments of type Картотека
   in brackets, the paid / unpaid badge button and the matches); the tile is
   red while the player has matches for the team in those tournaments and the
   fee is unpaid. The count line of the found rows (Картотеки, Входна такса)
   sits left of the search button. */
.fee-found {
    margin: 7px 0 0;
    font-weight: 600;
}
.fee-tile {
    display: inline-flex;
    align-items: center;
    vertical-align: top;
    min-width: 180px;
    max-width: 320px;
    margin: 0 6px 6px 0;
    padding: 5px 8px;
    border: 1px solid #dfe3e8;
    background: #fff;
}
.fee-tile .admin-avatar.fee-tile-logo {
    width: 36px;
    height: 36px;
    margin-right: 8px;
    flex-shrink: 0;
}
.fee-tile-body {
    line-height: 1.35;
}
.fee-tile-team {
    font-weight: 600;
}
.fee-tile-project {
    color: #7f8c8d;
}
.fee-tile-actions {
    margin-top: 3px;
    white-space: nowrap;
}
.fee-tile .fee-toggle {
    cursor: pointer;
}
/* An outlined badge that is a link (the Платена / Неплатена toggle) keeps
   its own colour on hover and focus: bootstrap's a.badge:hover paints the
   text white, which is unreadable on the white badge (owner, 2026-10-04) */
a.badge.badge-border-success:hover,
a.badge.badge-border-success:focus {
    color: #26c281;
    background: #fff;
    text-decoration: none;
}
a.badge.badge-border-danger:hover,
a.badge.badge-border-danger:focus {
    color: #ed6b75;
    background: #fff;
    text-decoration: none;
}
a.badge.badge-border-default:hover,
a.badge.badge-border-default:focus {
    color: #7f8c8d;
    background: #fff;
    text-decoration: none;
}
a.badge.badge-border-primary:hover,
a.badge.badge-border-primary:focus {
    color: #3598dc;
    background: #fff;
    text-decoration: none;
}
/* The orange and the blue ones too (the "3 / 8" read badge of admin/notices
   turned white on hover - owner, 2026-10-11) */
a.badge.badge-border-warning:hover,
a.badge.badge-border-warning:focus {
    color: #e7a300;
    background: #fff;
    text-decoration: none;
}
a.badge.badge-border-info:hover,
a.badge.badge-border-info:focus {
    color: #659be0;
    background: #fff;
    text-decoration: none;
}
.fee-tile .fee-toggle.fee-toggle-off {
    cursor: not-allowed;
}
.fee-tile .fee-toggle.fee-busy {
    opacity: 0.5;
}
.fee-tile.fee-tile-unpaid {
    background: rgba(231, 80, 90, 0.12);
    border-color: rgba(231, 80, 90, 0.55);
}
/* Входна такса (admin/entry-fees, owner 2026-10-03): the status badge of a
   team in a tournament (the outlined badges above: green paid, orange partly
   paid, red nothing paid, grey without an amount) and the Общо row */
.badge.entry-fee-status {
    text-transform: lowercase;
}

/* The page title (the h1 of backend/layouts/main) is gone on the phone and
   the tablet, on every admin page (owner, 2026-10-03): the menu says where
   you are and the screen is short. admin/matchs hid it on its own before. */
@media (max-width: 991px) {
    .page-title {
        display: none;
    }
}

/* The phone table of a squad (backend/squads/player_row_mobile): the three
   lines of a player are parted by thin rules, the players by a heavy one
   (owner, 2026-10-03) */
.squad-table-mobile > tbody > tr > td.squad-row-mobile-cell {
    padding: 0 4px !important;
    border-top: 2px solid #c2cad8 !important;
}
.squad-table-mobile .squad-row-mobile-line {
    padding: 6px 0;
    border-top: 1px solid #e7ecf1;
}
.squad-table-mobile .squad-row-mobile-line:first-child {
    border-top: 0;
}

/* The head office row of the Градове report (backend/finance/cities/row,
   owner 2026-10-04): София pays nobody and sits last under the divider on
   a very light grey row */
.table > tbody > tr.row-hq > td {
    background-color: #f5f7f9 !important;
}

/* The Facebook share modal of Мачове (owner, 2026-10-07): a mock-up of the
   post as the city's page will show it - the page with the crest, the
   text with its lines, the image, the action bar - on Facebook's grey */
.fb-mock-body {
    background: #f0f2f5;
}
.fb-mock {
    max-width: 500px;
    margin: 0 auto;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    font-family: Helvetica, Arial, sans-serif;
    color: #050505;
    overflow: hidden;
}
.fb-mock-head {
    display: flex;
    align-items: center;
    padding: 12px 16px 0;
}
.fb-mock-avatar {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #1877f2;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    overflow: hidden;
    border: 1px solid #dddfe2;
}
.fb-mock-avatar img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #fff;
}
.fb-mock-who {
    flex: 1 1 auto;
    margin-left: 8px;
    line-height: 1.3;
}
.fb-mock-name {
    display: block;
    font-weight: 600;
    font-size: 15px;
}
.fb-mock-meta {
    display: block;
    font-size: 13px;
    color: #65676b;
}
.fb-mock-more {
    color: #65676b;
    font-size: 18px;
}
.fb-mock-text {
    padding: 12px 16px;
    font-size: 15px;
    line-height: 1.35;
    white-space: pre-wrap;
    word-wrap: break-word;
}
.fb-mock-link {
    color: #385898;
}
.fb-mock-image {
    display: block;
    width: 100%;
    height: auto;
    border-top: 1px solid #dddfe2;
    border-bottom: 1px solid #dddfe2;
}
.fb-mock-actions {
    display: flex;
    margin: 0 16px;
    padding: 4px 0;
    font-size: 15px;
    font-weight: 600;
    color: #65676b;
}
.fb-mock-actions span {
    flex: 1 1 0;
    text-align: center;
    padding: 6px 0;
}
.fb-mock-note {
    max-width: 500px;
    margin: 10px auto 0;
    font-size: 13px;
    color: #65676b;
    text-align: center;
}

/* The live preview of a post next to its templates (Градове - Facebook,
   Турнири): the mock-up on Facebook's grey */
.fb-preview-body {
    padding: 15px;
    border-radius: 4px;
}

/* ======================================================================
   МАЧОВЕ - ОЦЕНКИ AND РЕДАКЦИЯ (owner, 2026-10-08)
   ====================================================================== */
/* The star of a row: grey - nothing yet, orange - partial, green - full */
.fixtures-table .fixture-icon-rate-none { color: #c3ccd5; }
.fixtures-table .fixture-icon-rate-partial { color: #e7a300; }
.fixtures-table .fixture-icon-rate-full { color: #26a69a; }
/* The star marks (fixture-stars.js): star-shaped buttons (clip-path) with
   the digit inside, pale grey at rest, the star's own colour (red to
   green along the row, --rate-c; the other way round for the stars of a
   match) on hover up to the hovered one and solid up to the chosen one */
.rate-stars {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 3px;
    vertical-align: middle;
    padding: 2px;
    border-radius: 3px;
}
.rate-stars .rate-star {
    position: relative;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    background: none;
    color: #dde3e9;
    cursor: pointer;
    transition: color .12s;
}
.rate-stars .rate-star svg {
    display: block;
    width: 32px;
    height: 32px;
}
.rate-stars .rate-star .rate-star-digit {
    position: absolute;
    left: 0;
    right: 0;
    top: 10px;
    font-size: 11px;
    font-weight: 700;
    line-height: 14px;
    text-align: center;
    color: #7f8c99;
}
.rate-stars .rate-star:focus {
    outline: none;
}
/* Hover: the thin outline in the star's darker colour, the fill stays pale
   (owner, 2026-10-09); chosen: the fill in the star's colour */
.rate-stars .rate-star.is-hover svg path {
    stroke: var(--rate-d, #3f6f9e);
    stroke-width: 2;
}
.rate-stars .rate-star.is-hover .rate-star-digit {
    color: var(--rate-d, #3f6f9e);
}
.rate-stars .rate-star.is-on {
    color: var(--rate-c, #6fa8dc);
}
.rate-stars .rate-star.is-on svg path {
    stroke: var(--rate-c, #6fa8dc);
    stroke-width: 3.5;
}
.rate-stars .rate-star.is-on .rate-star-digit {
    color: #fff;
}
/* A chosen star under the pointer keeps the darker outline too (owner,
   2026-10-09) */
.rate-stars .rate-star.is-on.is-hover svg path {
    stroke: var(--rate-d, #3f6f9e);
    stroke-width: 2.5;
}
.rate-stars.rate-stars-ten .rate-star,
.rate-stars.rate-stars-ten .rate-star svg {
    width: 27px;
    height: 27px;
}
.rate-stars.rate-stars-ten .rate-star .rate-star-digit {
    top: 8px;
    font-size: 10px;
}
.rate-stars.is-busy,
.rate-stars.is-locked {
    opacity: .6;
    pointer-events: none;
}
/* The modal of the marks */
.fixture-rate-title {
    font-weight: 400;
    color: #67809f;
}
/* The two tabs: half the width each, solid - green the open one, grey the
   other (as the switch; owner, 2026-10-09) */
.fixture-rate-tabs.nav-tabs {
    display: flex;
    border: 0;
    margin-bottom: 14px;
}
.fixture-rate-tabs.nav-tabs > li {
    flex: 1 1 50%;
    margin: 0;
    float: none;
}
.fixture-rate-tabs.nav-tabs > li > a,
.fixture-rate-tabs.nav-tabs > li > a:hover,
.fixture-rate-tabs.nav-tabs > li > a:focus {
    margin: 0;
    border: 0;
    border-radius: 0;
    background: #c3ccd5;
    color: #fff;
    text-align: center;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 12px;
    padding: 9px 6px;
}
.fixture-rate-tabs.nav-tabs > li:first-child > a {
    border-radius: 14px 0 0 14px;
}
.fixture-rate-tabs.nav-tabs > li:last-child > a {
    border-radius: 0 14px 14px 0;
}
.fixture-rate-tabs.nav-tabs > li.active > a,
.fixture-rate-tabs.nav-tabs > li.active > a:hover,
.fixture-rate-tabs.nav-tabs > li.active > a:focus {
    background: #26a69a;
    color: #fff;
    border: 0;
}
/* The official's head: the photo as tall as the role and the name */
.fixture-rate-official {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 400;
}
/* The photo of the official and the logo of a team: the avatar circle of
   the lists (admin-avatar), 36px here */
.fixture-rate-official .fixture-rate-photo,
.fixture-rate-team .fixture-rate-logo {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
}
.fixture-rate-team {
    display: flex;
    align-items: center;
    gap: 8px;
}
.fixture-rate-official .fixture-rate-role {
    font-weight: 600;
    font-size: 12px;
    color: #5c6b7a;
}
.fixture-rate-official .fixture-rate-name {
    font-size: 12px;
    color: #8c9aa8;
}
.fixture-rate-table {
    margin-bottom: 6px;
}
.fixture-rate-table > thead > tr > th,
.fixture-rate-table > tbody > tr > td {
    vertical-align: middle;
    padding: 6px 8px;
}
.fixture-rate-table > thead > tr > th small {
    font-weight: 400;
    color: #8c9aa8;
}
.fixture-rate-table .fixture-rate-label {
    width: 15%;
    font-weight: 600;
    font-size: 12px;
    color: #5c6b7a;
}
.fixture-rate-table .fixture-rate-section td {
    background: #f4f6f8;
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    color: #67809f;
}
.fixture-rate-table .fixture-rate-points td {
    border-top: 2px solid #e9edf1;
}
.fixture-rate-hint {
    font-size: 12px;
    margin: 0;
}
.fixture-rate .rate-manager {
    max-width: 100%;
}
/* The Оценки modal on a phone (owner, 2026-10-09): nothing wider than
   the screen. The head and a .fixture-rate-inline row (the managers'
   marks, the colleague's marks) are one line - the label 34%, the two
   sides 33% each; a .fixture-rate-stars-row (the admin's marks) is two
   lines, the label centred on the whole width and the two sides under
   it at 50% each; the heads centred without the logo or the photo, a
   long name cut; a manager without his team; the ten stars of an
   official five on a line */
@media (max-width: 767px) {
    #fixture-rate-modal .modal-body {
        padding-left: 10px;
        padding-right: 10px;
    }
    .fixture-rate-tabs.nav-tabs > li {
        min-width: 0;
    }
    .fixture-rate-tabs.nav-tabs > li > a,
    .fixture-rate-tabs.nav-tabs > li > a:hover,
    .fixture-rate-tabs.nav-tabs > li > a:focus {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    .fixture-rate-table,
    .fixture-rate-table > thead,
    .fixture-rate-table > tbody {
        display: block;
        width: 100%;
    }
    .fixture-rate-table > thead > tr,
    .fixture-rate-table > tbody > tr {
        display: flex;
        flex-wrap: wrap;
    }
    .fixture-rate-table > thead > tr > th,
    .fixture-rate-table > tbody > tr > td {
        flex: 0 0 50%;
        max-width: 50%;
        min-width: 0;
        padding: 4px;
        text-align: center;
        border-top: 0;
    }
    .fixture-rate-table > tbody > tr > td.fixture-rate-label,
    .fixture-rate-table > tbody > tr.fixture-rate-section > td {
        flex-basis: 100%;
        max-width: 100%;
        width: auto;
        padding-top: 8px;
        text-align: left;
        border-top: 1px solid #e7ecf1;
    }
    .fixture-rate-table .fixture-rate-points td.fixture-rate-label {
        border-top: 2px solid #e9edf1;
    }
    /* One line: the label and the two sides; the head keeps its empty
       first cell over the labels */
    .fixture-rate-table > thead > tr > th {
        flex: 0 0 33%;
        max-width: 33%;
    }
    .fixture-rate-table > thead > tr > th:first-child {
        flex: 0 0 34%;
        max-width: 34%;
    }
    .fixture-rate-table > tbody > tr.fixture-rate-inline > td {
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 33%;
        max-width: 33%;
        padding: 6px 2px;
        border-top: 1px solid #e7ecf1;
    }
    .fixture-rate-table > tbody > tr.fixture-rate-inline > td.fixture-rate-label {
        justify-content: flex-start;
        flex: 0 0 34%;
        max-width: 34%;
        padding: 6px 4px 6px 0;
        overflow-wrap: anywhere;
    }
    .fixture-rate-table > tbody > tr.fixture-rate-points.fixture-rate-inline > td {
        border-top: 2px solid #e9edf1;
    }
    /* The three stars of a manager smaller and never wrapped, to fit a
       third down to a 320px phone (Codex on PR #127) */
    .fixture-rate-inline .rate-stars {
        flex-wrap: nowrap;
        gap: 2px;
    }
    .fixture-rate-inline .rate-stars .rate-star,
    .fixture-rate-inline .rate-stars .rate-star svg {
        width: 24px;
        height: 24px;
    }
    .fixture-rate-inline .rate-stars .rate-star .rate-star-digit {
        top: 7px;
        font-size: 9px;
        line-height: 12px;
    }
    /* The admin's marks: the label centred over the two sides */
    .fixture-rate-table > tbody > tr.fixture-rate-stars-row > td.fixture-rate-label {
        text-align: center;
    }
    .fixture-rate-team .fixture-rate-logo,
    .fixture-rate-official .fixture-rate-photo,
    .fixture-rate .rate-manager-team {
        display: none;
    }
    .fixture-rate-team,
    .fixture-rate-official {
        justify-content: center;
        min-width: 0;
    }
    .fixture-rate-official .fixture-rate-official-text {
        min-width: 0;
        max-width: 100%;
    }
    .fixture-rate-team .fixture-rate-team-name,
    .fixture-rate-official .fixture-rate-role,
    .fixture-rate-official .fixture-rate-name {
        display: block;
        max-width: 100%;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    .rate-stars.rate-stars-ten {
        max-width: 138px;
        justify-content: center;
    }
    .rate-stars.rate-stars-ten .rate-star,
    .rate-stars.rate-stars-ten .rate-star svg {
        width: 24px;
        height: 24px;
    }
    .rate-stars.rate-stars-ten .rate-star .rate-star-digit {
        top: 7px;
        font-size: 9px;
        line-height: 12px;
    }
}
/* The Редакция screen (the panels are the theme's coloured portlets -
   owner, 2026-10-09) */
.fixture-edit .fixture-panel .portlet-title {
    min-height: 38px;
    padding: 0 10px;
}
.fixture-edit .fixture-panel .portlet-title .caption {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 0;
    font-size: 14px;
    font-weight: 600;
}
.fixture-edit .fixture-panel .portlet-body {
    padding: 10px 12px;
}
.fixture-edit .fixture-panel .fixture-switch {
    background: rgba(255, 255, 255, .45);
}
.fixture-edit .fixture-panel .fixture-switch.is-on {
    background: #fff;
}
.fixture-edit .fixture-panel .fixture-switch.is-on .fixture-switch-knob {
    background: #26a69a;
}
/* The head (owner, 2026-10-08): a grid - the teams with their crests on
   the left across both rows, the buttons top right, the tournament, the
   division and the round under them */
.fixture-edit .fixture-edit-head {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "teams buttons" "teams badges";
    gap: 6px 16px;
    align-items: center;
}
.fixture-edit .fixture-edit-head p {
    margin-bottom: 6px;
}
.fixture-edit .fixture-edit-head-buttons {
    grid-area: buttons;
    justify-self: end;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.fixture-edit .fixture-edit-head-teams {
    grid-area: teams;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    min-width: 0;
}
.fixture-edit .fixture-edit-head-badges {
    grid-area: badges;
    justify-self: end;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.fixture-edit .fixture-edit-crest {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
}
.fixture-edit .fixture-edit-teams {
    font-size: 16px;
}
.fixture-edit .fixture-edit-meta {
    color: #67809f;
}
/* The Facebook button of the head (owner, 2026-10-08): Споделен becomes
   Сподели отново under the pointer for an admin */
.fixture-edit .fixture-fb-again .fixture-fb-again-action,
.fixture-edit .fixture-fb-again:hover .fixture-fb-again-state,
.fixture-edit .fixture-fb-again:focus .fixture-fb-again-state {
    display: none;
}
.fixture-edit .fixture-fb-again:hover .fixture-fb-again-action,
.fixture-edit .fixture-fb-again:focus .fixture-fb-again-action {
    display: inline;
}
/* The schedule panel across the top (owner, 2026-10-08): the four values
   side by side, each the editor of the listing's row; they stack on a
   phone */
/* Four columns of a quarter each, the content centred in its column and on
   the line (owner, 2026-10-08); two by two on a phone */
.fixture-edit .fixture-schedule-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 0;
}
.fixture-edit .fixture-schedule-item {
    flex: 0 0 25%;
    max-width: 25%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 0;
    min-height: 32px;
    padding: 0 6px;
}
@media (max-width: 767px) {
    .fixture-edit .fixture-schedule-item {
        flex: 0 0 50%;
        max-width: 50%;
    }
}
/* The label is the icon alone, the word is its tooltip (owner, 2026-10-08) */
.fixture-edit .fixture-schedule-label {
    display: inline-flex;
    align-items: center;
    font-size: 14px;
    line-height: 1;
    color: #8c9aa8;
    white-space: nowrap;
    cursor: default;
}
.fixture-edit .fixture-schedule-value {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    font-size: 14px;
}
.fixture-edit .fixture-schedule-value .inline-x {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* The photo of the official: the avatar circle of the lineup (28px) */
.fixture-edit .fixture-schedule-photo {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    border: 2px solid #f1c40f;
}
.fixture-edit .fixture-schedule .inline-x {
    border-bottom: 1px dashed #b5bfc9;
    color: inherit;
    border-radius: 3px;
}
.fixture-edit .fixture-schedule .inline-x:hover {
    border-bottom-color: #4b77be;
    text-decoration: none;
}
.fixture-edit .fixture-schedule .inline-x.inline-x-empty {
    color: #9aa5b1;
}
.fixture-edit .fixture-panel {
    margin-bottom: 15px;
}
.fixture-edit .fixture-panel .panel-heading {
    padding: 8px 12px;
}
.fixture-edit .fixture-panel .panel-title {
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.fixture-edit .fixture-panel .panel-title small {
    font-size: 11px;
    font-weight: 400;
}
.fixture-edit .fixture-panel .panel-body {
    padding: 10px 12px;
}
.fixture-edit .fixture-param-table {
    margin-bottom: 4px;
}
.fixture-edit .fixture-param-table > thead > tr > th,
.fixture-edit .fixture-param-table > tbody > tr > td {
    padding: 5px 6px;
    vertical-align: middle;
    text-align: center;
}
.fixture-edit .fixture-param-table > thead > tr > th {
    font-size: 11px;
    color: #67809f;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 0;
}
.fixture-edit .fixture-param-table .fixture-param-label {
    text-align: left;
    font-weight: 600;
    color: #5c6b7a;
    white-space: nowrap;
}
.fixture-edit .fixture-param-team-mini {
    display: block;
    font-size: 10px;
    color: #8c9aa8;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.fixture-edit .inline-x.inline-x-spin {
    min-width: 3.6em;
}
.fixture-edit .fixture-settings-table .fixture-param-cell {
    text-align: right;
}
.fixture-edit .fixture-video {
    margin: 4px 0 0;
}
.fixture-edit .fixture-video input {
    border-radius: 3px;
}
/* The saved mark of the video (owner, 2026-10-08): the frame green with a
   tick on the right after a save, red after a refusal, until the text
   changes */
.fixture-edit .fixture-video-field {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
}
.fixture-edit .fixture-video-field input {
    flex: 1 1 auto;
    min-width: 0;
}
/* The red X that deletes the link (owner, 2026-10-08) */
.fixture-edit .fixture-video-clear {
    flex: 0 0 auto;
    padding: 0 4px;
    border: 0;
    background: none;
    color: #e7505a;
    font-size: 15px;
    cursor: pointer;
}
.fixture-edit .fixture-video-clear:hover {
    color: #c0392b;
}
.fixture-edit .fixture-video-field .fixture-video-mark {
    display: none;
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    color: #26a69a;
    font-size: 15px;
    pointer-events: none;
}
.fixture-edit .fixture-video-field.is-saved input {
    border-color: #26a69a;
    padding-right: 28px;
}
.fixture-edit .fixture-video-field.is-saved .fixture-video-mark {
    display: block;
}
.fixture-edit .fixture-video-field.is-refused input {
    border-color: #e7505a;
}
/* The icons of the screen: as in the listing */
.fixture-edit .fixture-icon {
    display: inline-block;
    padding: 0 2px;
    border: 0;
    border-radius: 3px;
    background: none;
    font-size: 18px;
    line-height: 1;
    color: #8c9aa8;
    cursor: pointer;
}
.fixture-edit .fixture-icon:hover {
    opacity: .75;
}
.fixture-edit .fixture-icon-on { color: #26a69a; }
.fixture-edit .fixture-icon-off { color: #e7505a; }
.fixture-edit .fixture-flag { padding: 0; }
/* The switch of the service result and of the penalties */
.fixture-switch {
    position: relative;
    width: 38px;
    height: 20px;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: #c3ccd5;
    cursor: pointer;
    vertical-align: middle;
    transition: background-color .15s;
}
.fixture-switch .fixture-switch-knob {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .25);
    transition: left .15s;
}
.fixture-switch.is-on {
    background: #26a69a;
}
.fixture-switch.is-on .fixture-switch-knob {
    left: 20px;
}
.fixture-switch:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(53, 152, 220, .35);
}
.fixture-edit .fixture-service-fields .control-label {
    font-size: 11px;
    margin-bottom: 2px;
}
.fixture-edit .fixture-service-reason {
    margin: 8px 0 4px;
}
/* The checks: the values left, the one-word name right (the full one in
   its tooltip); a yellow or red check is a solid badge */
.fixture-edit .fixture-checks-table > tbody > tr > td.fixture-check-values {
    text-align: left;
    white-space: nowrap;
    width: 1%;
}
.fixture-edit .fixture-checks-table > tbody > tr > td.fixture-check-label {
    text-align: right;
    font-weight: 600;
    color: #5c6b7a;
}
.fixture-edit .fixture-check-values .badge {
    min-width: 30px;
    font-size: 12px;
    padding: 3px 8px;
}
.fixture-edit .fixture-check-values .badge-default {
    background: #e9edf1;
    color: #5c6b7a;
}
.fixture-edit .fixture-check-values .badge-info {
    background: #e3eefa;
    color: #3598dc;
}
.fixture-edit .fixture-check-values .badge-success {
    background: #e2f5ee;
    color: #1f9d7e;
}
.fixture-edit .fixture-check-dash {
    margin: 0 4px;
    font-weight: 700;
    color: #8c9aa8;
}
.fixture-edit .fixture-edit-section {
    margin: 6px 0 12px;
    font-size: 15px;
    color: #4e5c6a;
}
.fixture-edit .fixture-edit-section small {
    font-size: 11px;
    margin-left: 6px;
}
/* The lineup changes (owner, 2026-10-09): the cross before the number
   (red when the player can go, pale and locked when he has a statistic),
   the nickname as a dashed trigger of the picker, the add button under
   the table */
.fixture-lineup-table .fixture-lineup-remove {
    width: 24px;
}
.fixture-edit .fixture-remove {
    font-size: 14px;
    color: #e7505a;
}
.fixture-edit .fixture-remove.fixture-remove-locked {
    color: #d0d6dc;
    cursor: not-allowed;
}
.fixture-lineup-table .fixture-lineup-remove .fixture-remove-locked,
.fixture-lineup-table .fixture-lineup-remove.is-locked .fixture-lineup-remove-btn {
    display: none;
}
.fixture-lineup-table .fixture-lineup-remove.is-locked .fixture-remove-locked {
    display: inline-block;
}
/* The picker of the squad: one row per player - the photo, the number,
   the nickname with the names under it, the "в мача" badge */
.fixture-picker-subtitle {
    font-weight: 400;
    color: #67809f;
}
.fixture-picker-note,
.fixture-picker-error {
    margin: 0 0 10px;
    font-size: 12px;
}
.fixture-picker-filter {
    margin-bottom: 8px;
}
.fixture-picker-list {
    max-height: 55vh;
    overflow-y: auto;
    border: 1px solid #e9edf1;
    border-radius: 3px;
}
.fixture-picker-item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 5px 8px;
    border: 0;
    border-bottom: 1px solid #eef1f4;
    background: #fff;
    text-align: left;
    cursor: pointer;
}
.fixture-picker-item:last-child {
    border-bottom: 0;
}
.fixture-picker-item:hover {
    background: #e3eefa;
}
.fixture-picker-item.is-taken {
    opacity: .5;
    cursor: not-allowed;
}
.fixture-picker-item .fixture-picker-photo {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
}
.fixture-picker-item .fixture-picker-number {
    flex: 0 0 26px;
    text-align: center;
    font-weight: 700;
    color: #5c6b7a;
}
.fixture-picker-item .fixture-picker-names {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}
.fixture-picker-item .fixture-picker-nick {
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.fixture-picker-item .fixture-picker-name {
    color: #8c9aa8;
}
.fixture-picker-empty {
    margin: 10px;
}
/* The lineup tables: the team's logo and name centred above each */
.fixture-edit .fixture-lineup-head {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 4px 0 10px;
    font-size: 15px;
    font-weight: 600;
    color: #4e5c6a;
}
.fixture-edit .fixture-lineup-logo {
    width: 36px;
    height: 36px;
}
.fixture-edit .fixture-lineup + .fixture-lineup {
    margin-top: 10px;
}
.fixture-lineup-table {
    margin-bottom: 0;
    table-layout: fixed;
}
.fixture-lineup-table > thead > tr > th,
.fixture-lineup-table > tbody > tr > td {
    padding: 4px 4px;
    font-size: 12px;
    text-align: center;
    vertical-align: middle;
}
.fixture-lineup-table > thead > tr > th {
    font-size: 11px;
    color: #67809f;
}
.fixture-lineup-table .fixture-lineup-number {
    width: 30px;
}
.fixture-lineup-table .fixture-lineup-player {
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.fixture-lineup-table .fixture-lineup-name {
    font-weight: 600;
}
/* The nickname sits on the middle of the photo (the dashed link of
   inline-edit.js aligns to the bottom by default; owner, 2026-10-09) */
.fixture-lineup-table .fixture-lineup-name.inline-x {
    vertical-align: middle;
}
/* The player's photo: the avatar circle with a yellow ring (owner,
   2026-10-09) */
.fixture-lineup-table .fixture-lineup-photo {
    width: 28px;
    height: 28px;
    margin-right: 6px;
    border: 2px solid #f1c40f;
    vertical-align: middle;
}
/* The pictures of the event types (EventTypeAdmin::iconUrl - the DB's
   own icons, owner 2026-10-09): the heads of the counts, the glove and
   the cup, the cells of a phone row */
.fixture-ev-img {
    width: 20px;
    height: 20px;
    object-fit: contain;
    vertical-align: middle;
}
.fixture-lineup-table .fixture-flag .fixture-ev-img {
    width: 22px;
    height: 22px;
    transition: filter .12s, opacity .12s;
}
.fixture-lineup-table .fixture-flag.fixture-icon-off .fixture-ev-img {
    filter: grayscale(1);
    opacity: .35;
}
.fixture-lineup-table .fixture-lineup-cell-icon {
    display: none;
}
.fixture-lineup-table .fixture-lineup-stat {
    width: 50px;
}
.fixture-lineup-table .fixture-lineup-flag {
    width: 32px;
}
.fixture-lineup-table .inline-x.inline-x-spin {
    min-width: 2.9em;
}
.fixture-lineup-table .inline-x.inline-x-spin:before {
    margin-right: 3px;
}
.fixture-lineup-table .inline-x.inline-x-spin:after {
    margin-left: 3px;
}
/* The timeline: the home side left, the away side right, the minute on the
   central line */
.fixture-timeline {
    position: relative;
    padding: 6px 0 10px;
}
.fixture-timeline:before {
    content: "";
    position: absolute;
    top: 30px;
    bottom: 0;
    left: 50%;
    width: 2px;
    margin-left: -1px;
    background: #e3e8ed;
}
/* The head of the timeline: the two logos in the middle, a little apart,
   each team's name right next to its logo (owner, 2026-10-09) */
.fixture-tl-head {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 28px;
    margin-bottom: 8px;
    font-weight: 600;
    color: #5c6b7a;
}
.fixture-tl-head .fixture-tl-side {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 0;
    min-width: 0;
}
.fixture-tl-head .fixture-tl-side-home {
    justify-content: flex-end;
}
.fixture-tl-head .fixture-tl-team {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.fixture-tl-head .admin-avatar {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
}
.fixture-tl-item {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 64px 1fr;
    column-gap: 8px;
    align-items: center;
    margin: 4px 0;
}
.fixture-tl-item .fixture-tl-card {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
    padding: 4px 10px;
    border: 1px solid #e3e8ed;
    border-radius: 3px;
    background: #fff;
    font-size: 12px;
}
.fixture-tl-home .fixture-tl-card {
    grid-column: 1;
    justify-self: end;
}
.fixture-tl-away .fixture-tl-card {
    grid-column: 3;
    justify-self: start;
}
/* The minute is the trigger of the number bubble, the nickname of the
   picker (owner, 2026-10-09) */
.fixture-tl-item .fixture-tl-minute,
.fixture-tl-item .fixture-tl-minute:hover,
.fixture-tl-item .fixture-tl-minute:focus {
    grid-column: 2;
    grid-row: 1;
    justify-self: center;
    width: 44px;
    padding: 1px 0;
    text-decoration: none;
    cursor: pointer;
    border-radius: 10px;
    background: #67809f;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    text-align: center;
}
/* The card: the picture, the number and the nickname in fixed widths; the
   home card is the mirror of the away one - the picture nearest the line */
.fixture-tl-item .fixture-tl-card .fixture-ev-img {
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
}
.fixture-tl-home .fixture-tl-card {
    flex-direction: row-reverse;
}
.fixture-tl-number {
    width: 26px;
    flex: 0 0 26px;
    padding: 0;
    border-radius: 3px;
    background: #e9edf1;
    color: #5c6b7a;
    font-size: 11px;
    font-weight: 700;
    text-align: center;
}
.fixture-tl-player {
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.fixture-tl-item .fixture-tl-player.inline-x {
    vertical-align: middle;
    margin: 0;
}

.fixture-tl-notice {
    color: #8c9aa8;
}
/* A phone: the parameters stack, a lineup row becomes a block - the player
   on the first line, the statistics as small labelled cells under it */
@media (max-width: 767px) {
    /* The head on a phone: one column - the buttons first, on the right,
       then the teams, then the badges (owner, 2026-10-08) */
    .fixture-edit .fixture-edit-head {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas: "buttons" "teams" "badges";
    }
    .fixture-edit .fixture-edit-head-buttons,
    .fixture-edit .fixture-edit-head-badges {
        justify-self: end;
    }
    /* The columns of the parameters stack as the result, the settings, then
       the service result with the penalties and the checks (owner, 2026-10-09) */
    .fixture-edit .fixture-params-row {
        display: flex;
        flex-direction: column;
    }
    .fixture-edit .fixture-col-result { order: 1; }
    .fixture-edit .fixture-col-settings { order: 2; }
    .fixture-edit .fixture-col-service { order: 3; }
    .fixture-lineup-table {
        table-layout: auto;
    }
    .fixture-lineup-table > thead {
        display: none;
    }
    /* A row: a grey first line - the number, the photo and the nickname
       from the left, the cross at the far right, one height (owner,
       2026-10-09) - and the seven cells under it with their icon over
       the value */
    .fixture-lineup-table > tbody > tr {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        padding: 0 0 4px;
        border-bottom: 1px solid #eef1f4;
    }
    .fixture-lineup-table > tbody > tr > td {
        border: 0;
        padding: 2px 3px;
    }
    .fixture-lineup-table .fixture-lineup-number,
    .fixture-lineup-table .fixture-lineup-player,
    .fixture-lineup-table .fixture-lineup-remove {
        display: flex;
        align-items: center;
        align-self: stretch;
        width: auto;
        min-height: 38px;
        padding: 5px 4px;
        background: #f1f3f6;
        white-space: nowrap;
    }
    /* The three make the whole first line, so the cells wrap under it */
    .fixture-lineup-table .fixture-lineup-number {
        order: 1;
        flex: 0 0 40px;
        padding-left: 8px;
        justify-content: flex-start;
    }
    .fixture-lineup-table .fixture-lineup-player {
        order: 2;
        flex: 0 0 calc(100% - 74px);
        max-width: calc(100% - 74px);
        min-width: 0;
        justify-content: flex-start;
        text-align: left;
    }
    .fixture-lineup-table .fixture-lineup-player .fixture-lineup-photo {
        flex: 0 0 auto;
    }
    .fixture-lineup-table .fixture-lineup-player .fixture-lineup-name {
        min-width: 0;
    }
    .fixture-lineup-table .fixture-lineup-remove {
        order: 3;
        flex: 0 0 34px;
        justify-content: center;
    }
    .fixture-lineup-table .fixture-lineup-stat,
    .fixture-lineup-table .fixture-lineup-flag {
        order: 4;
        display: flex;
        flex-direction: column;
        align-items: center;
        flex: 1 0 14%;
        width: auto;
        margin-top: 4px;
    }
    .fixture-lineup-table .fixture-lineup-cell-icon {
        display: block;
        margin-bottom: 3px;
    }
    /* The minute keeps a little air from the cards (owner, 2026-10-09) */
    .fixture-tl-item {
        grid-template-columns: 1fr 44px 1fr;
        column-gap: 8px;
    }
    .fixture-tl-item .fixture-tl-card {
        padding: 3px 6px;
        font-size: 11px;
    }
    /* The ten stars of an official in two rows of five */
    .rate-stars.rate-stars-ten {
        width: 160px;
    }
}
/* Махни от турнира in the Турнири modal of Отбори (owner, 2026-10-08): its
   own line under the tournament, smaller than the row buttons */
.team-tournaments-table .team-unassign-button {
    margin: 2px 0 6px;
    padding: 1px 8px;
    font-size: 11px;
    line-height: 1.5;
}
/* The X of a timeline event (owner, 2026-10-08): grey, red under the
   pointer, nearest the line */
.fixture-tl-item .fixture-tl-remove {
    flex: 0 0 auto;
    padding: 0 2px;
    border: 0;
    background: none;
    color: #c3ccd5;
    font-size: 13px;
    line-height: 1;
    cursor: pointer;
}
.fixture-tl-item .fixture-tl-remove:hover,
.fixture-tl-item .fixture-tl-remove:focus {
    color: #e7505a;
    outline: none;
}
/* The add buttons of the timeline and the lineups: small, centred under
   their block (owner, 2026-10-08) */
.fixture-edit .fixture-add-row {
    margin-top: 10px;
    text-align: center;
}
/* The add modal: the types as chips with their pictures, the players of
   the two lineups under the logo and the name of each team */
.fixture-event-types {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.fixture-event-type {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border: 1px solid #e1e5ec;
    border-radius: 3px;
    background: #fff;
    color: #2f353b;
    font-weight: 600;
    cursor: pointer;
}
.fixture-event-type .fixture-ev-img {
    width: 22px;
    height: 22px;
}
.fixture-event-type:hover,
.fixture-event-type:focus {
    border-color: #3598dc;
    outline: none;
}
.fixture-event-type.is-selected {
    background-color: #3598dc;
    border-color: #3598dc;
    color: #fff;
}
.fixture-event-players {
    max-height: 40vh;
}
.fixture-event-team {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    background: #f1f4f7;
    font-weight: 700;
    color: #5c6b7a;
}
.fixture-event-team .fixture-event-team-logo {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
}
.fixture-event-player.is-selected,
.fixture-event-player.is-selected:hover {
    background: #3598dc;
    color: #fff;
}
.fixture-event-player.is-selected .fixture-picker-number {
    color: #fff;
}

/* Известия (admin/notices, owner 2026-10-09): the timeline of an account's
   notices (backend/notices/inbox) - the rules of admin/system-messages in
   sportclub-3 scoped to it (the grey body with a border, the picture of
   the author filling the circle, the badge and the line gone on a phone),
   the picture small (50px, the line and the body moved with it), the
   Прочети button centred on the right of the body, a read item going grey
   (the picture too) */
.notice-timeline .timeline-body {
    background: #f5f5f5;
    border: 1px solid #ddd;
    margin-left: 75px;
}
.notice-timeline .timeline-body-arrow {
    border-color: transparent #ddd transparent transparent;
}
.notice-timeline.timeline:before {
    background: #eee;
    margin-left: 23px;
}
.notice-timeline .timeline-badge {
    width: 50px;
    height: 50px;
    padding-right: 0;
    margin-top: 20px;
}
.notice-timeline .timeline-icon {
    width: 50px;
    height: 50px;
}
.notice-timeline .timeline-badge-userpic {
    border: 2px solid #ddd;
    height: 100%;
    width: 100%;
    object-fit: cover;
}
.notice-timeline .timeline-icon-pic {
    padding: 0 !important;
}
/* The head: the read state and the title left, the author and the date
   right on one line (owner, 2026-10-09); under 992px they stack, both left */
.notice-timeline .notice-head {
    margin-bottom: 10px;
}
.notice-timeline .notice-head-right {
    text-align: right;
    white-space: nowrap;
}
.notice-timeline .notice-head-right .timeline-body-alerttitle {
    font-size: 14px;
}
.notice-timeline .notice-head-right .timeline-body-time {
    font-size: 13px;
    margin-left: 6px;
}
.notice-timeline .notice-read-mark {
    margin-right: 6px;
    font-size: 12px;
    vertical-align: middle;
}
@media (max-width: 991px) {
    .notice-timeline .notice-head-right {
        text-align: left;
        white-space: normal;
        margin-top: 4px;
    }
}
/* The second line: the thumbnail, the text and the button, centred on each
   other on a desktop */
.notice-timeline .notice-pic img {
    max-height: 100px;
    max-width: 100%;
    width: auto;
    height: auto;
}
.notice-timeline .notice-action {
    text-align: center;
}
@media (min-width: 992px) {
    .notice-timeline .notice-body {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }
}
@media (max-width: 991px) {
    .notice-timeline .notice-action {
        text-align: right;
    }
    .notice-timeline .notice-body .notice-text {
        margin-top: 10px;
    }
}
.notice-timeline .timeline-item.notice-item-read .timeline-body {
    opacity: 0.75;
}
.notice-timeline .timeline-item.notice-item-read .timeline-badge-userpic {
    filter: grayscale(1);
    opacity: 0.7;
}
.notice-timeline .notice-title {
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
}
.notice-timeline .notice-title a {
    color: #3f4f62;
}
.notice-timeline .notice-item-read .notice-title a {
    color: #95a5a6;
}
@media (max-width: 768px) {
    .notice-timeline .timeline-badge,
    .notice-timeline.timeline:before,
    .notice-timeline .timeline-body-arrow {
        display: none;
    }
    .notice-timeline .timeline-body {
        margin-left: 0;
    }
}
.notice-text img {
    max-width: 100%;
    height: auto;
}
/* In the timeline a picture of the text is a thumbnail (owner, 2026-10-09:
   about 100px high); the page of the notice shows it whole */
.notice-timeline .notice-text img {
    max-height: 100px;
    width: auto;
}
.notice-text p:last-child {
    margin-bottom: 0;
}
.notice-readers-heading {
    margin: 0 0 10px 0;
    font-size: 14px;
    font-weight: 600;
}
.notice-readers-table {
    margin-bottom: 0;
}
.notice-readers-table td {
    vertical-align: middle !important;
}
.notice-readers-table .notice-readers-when {
    text-align: right;
    white-space: nowrap;
}
#notice-readers-modal .modal-body {
    max-height: 60vh;
    overflow-y: auto;
}
#notice-readers-modal .notice-readers-title {
    font-weight: 400;
}

/* Инструменти - Копиране на състави (owner, 2026-10-10): the steps line
   of the theme (mt-element-step, step-line) sized for a module page, the
   groups of step 2 - one coloured band per tournament, the teams as
   checkable rows with the crest and the count badge - and the report of
   step 3 */
.squad-copy-steps {
    margin-bottom: 10px;
}
.squad-copy-steps .step-line .mt-step-col {
    padding: 20px 0 10px 0;
}
.squad-copy-steps .step-line .mt-step-number {
    font-size: 20px;
    height: 46px;
    width: 46px;
    padding: 6px;
}
.squad-copy-steps .step-line .mt-step-title {
    font-size: 15px;
    font-weight: 600;
}
.squad-copy-steps .step-line .mt-step-title:before,
.squad-copy-steps .step-line .mt-step-title:after {
    top: -24px;
}
.squad-copy-steps .step-line .mt-step-content {
    font-size: 13px;
}
@media (max-width: 991px) {
    .squad-copy-steps .step-line .mt-step-col {
        padding: 10px 0 5px 0;
    }
    .squad-copy-steps .step-line .mt-step-title:before,
    .squad-copy-steps .step-line .mt-step-title:after {
        content: none;
    }
    .squad-copy-steps .step-line .mt-step-content {
        display: none;
    }
}
.squad-copy-panel .form-actions {
    background-color: transparent;
    border-top: 1px solid #e7ecf1;
}
.squad-copy-selected {
    margin-left: 10px;
    line-height: 34px;
}
.squad-copy-error {
    margin-top: 10px;
}
/* The groups of step 2: the band carries the tournament, the colour is
   the group's (four colours in turn) */
.squad-copy-group {
    border: 1px solid #e7ecf1;
    border-left-width: 6px;
    margin-bottom: 15px;
}
.squad-copy-group-head {
    padding: 8px 12px;
    font-weight: 600;
    font-size: 14px;
    color: #fff;
}
.squad-copy-group-head .squad-copy-group-tools {
    float: right;
    font-weight: 400;
    font-size: 12px;
}
.squad-copy-group-head .squad-copy-group-tools a,
.squad-copy-group-head .squad-copy-group-tools .text-muted {
    color: #fff;
}
.squad-copy-group-head .squad-copy-group-tools a:hover {
    text-decoration: underline;
}
.squad-copy-group-0 { border-left-color: #3598dc; }
.squad-copy-group-0 .squad-copy-group-head { background-color: #3598dc; }
.squad-copy-group-1 { border-left-color: #26c281; }
.squad-copy-group-1 .squad-copy-group-head { background-color: #26c281; }
.squad-copy-group-2 { border-left-color: #8e44ad; }
.squad-copy-group-2 .squad-copy-group-head { background-color: #8e44ad; }
.squad-copy-group-3 { border-left-color: #f2784b; }
.squad-copy-group-3 .squad-copy-group-head { background-color: #f2784b; }
.squad-copy-group-body {
    padding: 10px 12px 0 12px;
}
.squad-copy-team {
    display: block;
    width: 100%;
    margin: 0 0 10px 0;
    padding: 5px 8px;
    border: 1px solid #e7ecf1;
    border-radius: 4px !important;
    font-weight: 400;
    cursor: pointer;
    background-color: #fff;
}
.squad-copy-team:hover {
    background-color: #f5f7f9;
}
.squad-copy-team.squad-copy-team-on {
    border-color: #26c281;
    background-color: #eefaf4;
}
.squad-copy-team .squad-copy-team-check {
    margin: 0 8px 0 0;
    vertical-align: middle;
}
.squad-copy-team .squad-copy-team-name {
    vertical-align: middle;
    font-size: 14px;
}
.squad-copy-team .squad-copy-count {
    float: right;
    margin-top: 8px;
}
.squad-copy-team.squad-copy-team-empty {
    color: #95a5a6;
}
.squad-copy-team.squad-copy-team-empty .squad-copy-crest {
    filter: grayscale(1);
    opacity: 0.6;
}
.team-crest.squad-copy-crest {
    width: 32px;
    height: 32px;
    padding: 2px;
    margin-right: 4px;
    vertical-align: middle;
}
/* The report of step 3 */
.squad-copy-report .squad-copy-problems {
    margin-bottom: 0;
}
.squad-copy-report .squad-copy-verdict h4 {
    margin-top: 0;
}
.squad-copy-report .squad-copy-to {
    font-size: 15px;
    margin: 0 0 10px 0;
}
.squad-copy-table td {
    vertical-align: middle !important;
}
.squad-copy-table-mobile .squad-copy-mobile-line {
    padding: 3px 0;
}
.squad-copy-table-mobile .squad-copy-mobile-line + .squad-copy-mobile-line {
    border-top: 1px solid #e7ecf1;
}
.squad-copy-result .squad-copy-result-list {
    font-size: 14px;
}
.squad-copy-result .squad-copy-result-list li {
    margin-bottom: 4px;
}

/* The floating help button with unread answers (owner, 2026-10-10): a red
   pill with the count in words instead of the circle - the icon in its own
   lighter bubble on the left, the text after it; the ring pulses six times
   and ends invisible; it leads straight to Поддръжка */
.phone-call.phone-call-pill {
    width: auto !important;
    height: 58px !important;
    padding: 0 22px 0 7px !important;
    border-radius: 29px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    opacity: 1 !important;
    color: #fff !important;
    text-decoration: none !important;
}
.phone-call.phone-call-pill:hover,
.phone-call.phone-call-pill:focus {
    color: #fff !important;
    text-decoration: none !important;
}
/* The circle's hover rules for its span (absolute, translateY) must not
   reach the pill's spans - the icon bubble jumped out of the pill on hover */
.phone-call.phone-call-pill span,
.phone-call.phone-call-pill:hover span {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    -webkit-transform: none !important;
    visibility: visible !important;
    opacity: 1 !important;
    line-height: 1.2 !important;
}
.phone-call.phone-call-pill .phone-call-pill-icon {
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    margin: 0 12px 0 0 !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.22);
    position: static !important;
    visibility: visible !important;
    opacity: 1 !important;
}
.phone-call.phone-call-pill img,
.phone-call.phone-call-pill:hover img {
    display: block !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
}
.phone-call.phone-call-pill .phone-call-pill-text,
.phone-call.phone-call-pill:hover .phone-call-pill-text,
.phone-call.phone-call-pill .phone-call-pill-text span {
    visibility: visible !important;
    opacity: 1 !important;
    position: static !important;
    transform: none !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 600;
    text-transform: none !important;
    line-height: 1.2 !important;
    white-space: nowrap;
}
@keyframes pulse-pill {
    0% {
        transform: scale(0.9);
        opacity: 0.6;
    }
    100% {
        transform: scale(1.12);
        opacity: 0;
    }
}
.phone-call.phone-call-pill:before {
    top: -6px;
    left: -6px;
    right: -6px;
    bottom: -6px;
    width: auto;
    height: auto;
    border-radius: 35px;
    opacity: 0;
    animation: pulse-pill 1.8s ease-out 6 forwards;
    -webkit-animation: pulse-pill 1.8s ease-out 6 forwards;
}
/* The ticket with an unread answer in Поддръжка: a tinted row and a red
   button that pulses six times */
.support-ticket-unread.portlet.light {
    background-color: #fdf3f3;
    box-shadow: inset 3px 0 0 #e35b5a;
}
@keyframes pulse-read {
    0% {
        box-shadow: 0 0 0 0 rgba(227, 91, 90, 0.7);
    }
    70% {
        box-shadow: 0 0 0 8px rgba(227, 91, 90, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(227, 91, 90, 0);
    }
}
.btn.support-read-unread {
    animation: pulse-read 1.6s ease-out 6;
    -webkit-animation: pulse-read 1.6s ease-out 6;
}
@media (prefers-reduced-motion: reduce) {
    .phone-call:before,
    .btn.support-read-unread {
        animation: none;
        -webkit-animation: none;
    }
}

/* The popup of the unread notices (owner, 2026-10-10): bottom left on a
   desktop, 440 x 230; at the very bottom on a phone, 90% wide and 3:2 -
   there the floating help button moves above it (body.has-notice-popup).
   A dark grey bar on top with the kind, the date and the cross; the first
   picture on the left third, the title over the text on the right; one
   big green Прочети at the bottom; the dots under it. Slides in from
   below. */
.notice-popup {
    position: fixed;
    left: 20px;
    bottom: 20px;
    width: 440px;
    height: 230px;
    background: #fff;
    border: 1px solid #d5dbe1;
    border-radius: 4px !important;
    box-shadow: 0 6px 24px rgba(20, 30, 45, 0.25);
    z-index: 1002;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}
.notice-popup.notice-popup--in {
    opacity: 1;
    transform: translateY(0);
}
.notice-popup__close {
    position: absolute;
    top: 0;
    right: 0;
    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    color: #fff;
    font-size: 15px;
    z-index: 2;
}
.notice-popup__close:hover {
    color: #fff;
    background: #e35b5a;
    text-decoration: none;
}
.notice-popup__slides {
    flex: 1 1 auto;
    min-height: 0;
}
.notice-popup__slide {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.notice-popup__bar {
    flex: 0 0 34px;
    height: 34px;
    line-height: 34px;
    padding: 0 40px 0 12px;
    background: #3f4f62;
    color: #fff;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
}
.notice-popup__bar .notice-popup__date {
    color: #c3ccd5;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    margin-left: 8px;
}
.notice-popup__body {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    gap: 12px;
    padding: 10px 12px;
}
.notice-popup__pic {
    flex: 0 0 33%;
    max-width: 33%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f5f7f9;
    border-radius: 3px !important;
    overflow: hidden;
    color: #c3ccd5;
    font-size: 36px;
}
.notice-popup__pic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.notice-popup__right {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
}
.notice-popup__title {
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: #3f4f62;
    line-height: 1.25;
    margin: 0 0 5px 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.notice-popup__text {
    font-size: 12px;
    line-height: 1.4;
    color: #5c6b7c;
    overflow: hidden;
}
.notice-popup__foot {
    flex: 0 0 auto;
    padding: 0 12px 10px 12px;
}
.notice-popup__foot .btn {
    display: block;
    width: 100%;
    margin: 0;
    font-weight: 600;
}
.notice-popup__dots {
    flex: 0 0 auto;
    text-align: center;
    padding: 0 0 8px 0;
    line-height: 10px;
}
.notice-popup__dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin: 0 3px;
    border-radius: 50% !important;
    background: #d5dbe1;
}
.notice-popup__dot.active {
    background: #26c281;
}
@media (max-width: 768px) {
    .notice-popup {
        left: 5%;
        right: 5%;
        bottom: 10px;
        width: 90%;
        height: 60vw;
        max-height: 60vh;
    }
    /* The floating help button and its actions above the popup - by the
       popup's real height, 60vw capped at 60vh (landscape: the cap wins;
       Bugbot on PR #131); the plain 60vw line is the fallback of a
       browser without min() */
    body.has-notice-popup .phone-call {
        bottom: calc(60vw + 30px);
        bottom: calc(min(60vw, 60vh) + 30px);
    }
    body.has-notice-popup .help-fab-actions {
        bottom: calc(60vw + 115px);
        bottom: calc(min(60vw, 60vh) + 115px);
    }
}
/* Nothing floating on paper: the help button, the notices popup and
   anything else marked printnone (the class had no rule until now -
   Bugbot on PR #131) */
@media print {
    .printnone,
    .notice-popup {
        display: none !important;
    }
}