/* =====================================================
   HORSES PAGE
===================================================== */

.portal-horses-page {
    max-width: 1150px;
    margin: 0 auto;
    padding-bottom: 110px;
}


/* HEADER */

.portal-horses-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    margin-bottom: 16px;
    padding: 16px;

    border: 1px solid #eee;
    border-radius: 16px;

    background: #fff;
    box-shadow: 0 4px 18px rgba(0,0,0,.035);
}

.portal-horses-eyebrow {
    display: block;

    margin-bottom: 3px;

    color: var(--primary-color);

    font-size: 14px;
    font-weight: 600;
}

.portal-horses-header h3 {
    margin: 0 0 4px;

    font-size: 20px;
    font-weight: 700;
}

.portal-horses-header p {
    margin: 0;

    color: #888;

    font-size: 14px;
}

.portal-horses-count {
    flex: 0 0 auto;

    min-width: 78px;

    padding: 8px 12px;

    border-radius: 12px;

    background: rgba(92,45,145,.07);

    text-align: center;
}

.portal-horses-count strong,
.portal-horses-count span {
    display: block;
}

.portal-horses-count strong {
    color: var(--primary-color);

    font-size: 20px;
}

.portal-horses-count span {
    margin-top: 1px;

    color: #888;

    font-size: 14px;
}


/* =====================================================
   FILTERS
===================================================== */

.portal-horses-filter-card {
    margin-bottom: 14px;
    padding: 14px;

    border: 1px solid #eee;
    border-radius: 14px;

    background: #fff;
}

.portal-horses-filter-heading {
    display: flex;
    align-items: center;
    gap: 9px;

    margin-bottom: 12px;
}

.portal-horses-filter-heading > i {
    color: var(--primary-color);
}

.portal-horses-filter-heading strong,
.portal-horses-filter-heading small {
    display: block;
}

.portal-horses-filter-heading strong {
    font-size: 14px;
}

.portal-horses-filter-heading small {
    margin-top: 1px;

    color: #999;

    font-size: 14px;
}

.portal-horses-filter-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.portal-horses-filter-field label {
    display: block;

    margin-bottom: 5px;

    color: #777;

    font-size: 14px;
}

.portal-horses-filter-field .form-control {
    min-height: 44px;

    border-radius: 9px;

    font-size: 14px;
}


/* =====================================================
   STATUS TABS
===================================================== */

.portal-horse-status-tabs {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;

    margin-bottom: 18px;
}

.portal-horse-status-tab {
    min-height: 52px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 8px 10px;

    border: 1px solid #e7e7e7;
    border-radius: 11px;

    background: #fff;
    color: #777;

    font-size: 14px;
    font-weight: 600;

    text-decoration: none !important;
}

.portal-horse-status-tab strong {
    min-width: 20px;

    padding: 1px 5px;

    border-radius: 10px;

    background: #f3f3f3;

    text-align: center;

    font-size: 14px;
}

.portal-horse-status-tab.success.active {
    border-color: rgba(40,167,69,.35);

    background: rgba(40,167,69,.07);
    color: #27843c;
}

.portal-horse-status-tab.warning.active {
    border-color: rgba(255,193,7,.4);

    background: rgba(255,193,7,.08);
    color: #8a6d00;
}

.portal-horse-status-tab.danger.active {
    border-color: rgba(220,53,69,.3);

    background: rgba(220,53,69,.06);
    color: #b22b39;
}

.portal-horse-status-tab.info {
    color: #168096;
}

.portal-horse-status-arrow {
    font-size: 14px;
}


/* =====================================================
   HORSE CARD
===================================================== */

.portal-horse-card {
    height: 100%;

    padding: 16px;

    border: 1px solid #eee;
    border-radius: 16px;

    background: #fff;

    box-shadow: 0 4px 18px rgba(0,0,0,.035);
}

.portal-horse-card.status-1 {
    border-top: 3px solid #28a745;
}

.portal-horse-card.status-2 {
    border-top: 3px solid #ffc107;
}

.portal-horse-card.status-0,
.portal-horse-card.status-3 {
    border-top: 3px solid #dc3545;
}


/* CARD HEADER */

.portal-horse-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;

    margin-bottom: 14px;
}

.portal-horse-main {
    display: flex;
    align-items: center;
    gap: 10px;

    min-width: 0;
}

.portal-horse-main-icon {
    flex: 0 0 46px;

    width: 46px;
    height: 46px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 13px;

    background: rgba(92,45,145,.08);
    color: var(--primary-color);

    font-size: 18px;
}

.portal-horse-main-info {
    min-width: 0;
}

.portal-horse-id {
    display: block;

    color: #aaa;

    font-size: 14px;
}

.portal-horse-main-info h4 {
    margin: 1px 0 4px;

    overflow: hidden;

    font-size: 16px;
    font-weight: 700;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.portal-horse-midan {
    display: flex;
    align-items: center;
    gap: 4px;

    color: #888;

    font-size: 14px;
}

.portal-horse-card-status {
    flex: 0 0 auto;

    display: flex;
    align-items: center;
    gap: 6px;
}

.portal-horse-view-btn {
    width: 34px;
    height: 34px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0;

    border: 1px solid #ddd;
    border-radius: 9px;

    background: #fff;
    color: var(--primary-color);

    cursor: pointer;
}


/* =====================================================
   REQUIRED ACTION
===================================================== */

.portal-horse-action-required {
    margin-bottom: 14px;
    padding: 11px;

    border-radius: 11px;
}

.portal-horse-action-required.warning {
    background: rgba(255,193,7,.08);
}

.portal-horse-action-required.danger {
    background: rgba(220,53,69,.06);
}

.portal-horse-action-required-text {
    display: flex;
    align-items: flex-start;
    gap: 8px;

    margin-bottom: 9px;
}

.portal-horse-action-required-text strong,
.portal-horse-action-required-text small {
    display: block;
}

.portal-horse-action-required-text strong {
    font-size: 14px;
}

.portal-horse-action-required-text small {
    margin-top: 2px;

    color: #777;

    font-size: 14px;
}

.portal-horse-action-required .btn {
    width: 100%;

    min-height: 40px;

    border-radius: 8px;

    font-size: 14px;
    font-weight: 600;
}


/* REVIEW */

.portal-horse-review-state {
    display: flex;
    align-items: flex-start;
    gap: 8px;

    margin-bottom: 14px;
    padding: 10px;

    border-radius: 10px;

    background: rgba(255,193,7,.07);

    color: #856b13;
}

.portal-horse-review-state strong,
.portal-horse-review-state small {
    display: block;
}

.portal-horse-review-state strong {
    font-size: 14px;
}

.portal-horse-review-state small {
    margin-top: 1px;

    color: #8c856e;

    font-size: 14px;
}


/* =====================================================
   DETAILS
===================================================== */

.portal-horse-details-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 7px;

    margin-bottom: 14px;
}

.portal-horse-detail {
    padding: 8px;

    border-radius: 9px;

    background: #f8f9fa;
}

.portal-horse-detail span,
.portal-horse-detail strong {
    display: block;
}

.portal-horse-detail span {
    margin-bottom: 2px;

    color: #999;

    font-size: 14px;
}

.portal-horse-detail strong {
    overflow: hidden;

    color: #444;

    font-size: 14px;

    text-overflow: ellipsis;
    white-space: nowrap;
}


/* =====================================================
   BLOCKS
===================================================== */

.portal-horse-block {
    margin-top: 12px;
    padding-top: 12px;

    border-top: 1px solid #eee;
}

.portal-horse-block-title {
    display: flex;
    align-items: center;
    gap: 6px;

    margin-bottom: 8px;

    color: #888;

    font-size: 14px;
}


/* TRAINER */

.portal-horse-trainer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 10px;

    border-radius: 10px;

    text-decoration: none !important;
}

.portal-horse-trainer small,
.portal-horse-trainer strong {
    display: block;
}

.portal-horse-trainer small {
    font-size: 14px;
}

.portal-horse-trainer strong {
    margin-top: 2px;

    font-size: 14px;
}

.portal-horse-trainer.success {
    background: rgba(40,167,69,.07);
    color: #27843c;
}

.portal-horse-trainer.pending {
    background: rgba(255,193,7,.08);
    color: #866c12;
}

.portal-horse-trainer.action {
    background: rgba(23,162,184,.08);
    color: #177d90;
}

.portal-horse-trainer.disabled {
    background: #f8f9fa;
    color: #999;
}


/* =====================================================
   PAYMENT
===================================================== */

.portal-horse-payment {
    margin-top: 12px;
    padding: 12px;

    border: 1px solid rgba(92,45,145,.12);
    border-radius: 11px;

    background: rgba(92,45,145,.025);
}

.portal-horse-payment-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.portal-horse-payment-title {
    display: flex;
    align-items: center;
    gap: 8px;
}

.portal-horse-payment-title > i {
    color: var(--primary-color);

    font-size: 17px;
}

.portal-horse-payment-title small,
.portal-horse-payment-title strong {
    display: block;
}

.portal-horse-payment-title small {
    color: #888;

    font-size: 14px;
}

.portal-horse-payment-title strong {
    margin-top: 1px;

    font-size: 16px;
}

.portal-horse-paid-badge,
.portal-horse-unpaid-badge {
    padding: 4px 9px;

    border-radius: 15px;

    font-size: 14px;
    font-weight: 700;
}

.portal-horse-paid-badge {
    background: rgba(40,167,69,.1);
    color: #27843c;
}

.portal-horse-unpaid-badge {
    background: rgba(220,53,69,.09);
    color: #b22b39;
}

.portal-horse-payment-breakdown {
    display: flex;
    gap: 12px;

    margin-top: 8px;

    color: #999;

    font-size: 14px;
}

.portal-horse-pay-btn {
    min-height: 43px;

    margin-top: 10px;

    border-radius: 9px;

    font-size: 14px;
    font-weight: 600;
}


/* =====================================================
   EMPTY
===================================================== */

.portal-horses-empty {
    padding: 35px 15px;

    border: 1px solid #eee;
    border-radius: 16px;

    background: #fff;

    text-align: center;
}

.portal-horses-empty-icon {
    width: 58px;
    height: 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin: 0 auto 12px;

    border-radius: 50%;

    background: rgba(92,45,145,.07);
    color: var(--primary-color);

    font-size: 22px;
}

.portal-horses-empty h5 {
    margin-bottom: 4px;

    font-size: 16px;
}

.portal-horses-empty p {
    margin: 0;

    color: #999;

    font-size: 14px;
}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 575.98px) {

    .portal-horses-page {
        padding-right: 12px;
        padding-left: 12px;
    }

    .portal-horses-header {
        padding: 13px;

        border-radius: 14px;
    }

    .portal-horses-header h3 {
        font-size: 18px;
    }

    .portal-horses-header p {
        font-size: 14px;
    }

    .portal-horses-count {
        min-width: 65px;

        padding: 7px;
    }

    .portal-horses-count strong {
        font-size: 17px;
    }


    /* FILTERS */

    .portal-horses-filter-form {
        grid-template-columns: 1fr 1fr;
    }


    /* STATUS */

    .portal-horse-status-tabs {
        grid-template-columns: repeat(2, 1fr);
    }

    .portal-horse-status-tab {
        min-height: 48px;

        font-size: 14px;
    }


    /* CARD */

    .portal-horse-card {
        padding: 13px;

        border-radius: 14px;
    }

    .portal-horse-main-icon {
        flex-basis: 42px;

        width: 42px;
        height: 42px;
    }

    .portal-horse-main-info h4 {
        font-size: 16px;
    }


    /* DETAILS */

    .portal-horse-details-grid {
        grid-template-columns: repeat(2, 1fr);
    }


    /* PAYMENT */

    .portal-horse-payment-title strong {
        font-size: 16px;
    }
}

.portal-horses-main-nav {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;

    margin-bottom: 14px;
    padding: 5px;

    border: 1px solid #eee;
    border-radius: 13px;

    background: #f7f7f8;
}

.portal-horses-main-nav-item {
    min-height: 46px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;

    padding: 8px 12px;

    border-radius: 9px;

    color: #777;

    font-size: 14px;
    font-weight: 600;

    text-decoration: none !important;
}

.portal-horses-main-nav-item.active {
    background: #fff;
    color: var(--primary-color);

    box-shadow: 0 2px 9px rgba(0,0,0,.06);
}

.portal-horses-main-nav-item i {
    font-size: 14px;
}













/* =====================================================
   HORSE DETAILS MODAL
===================================================== */

#horseDetailsModal {
    z-index: 1055;
}

#horseDetailsModal .modal-dialog {
    max-width: 760px;
    margin: 20px auto;
}

#horseDetailsModal .modal-content {
    width: 100%;
    border: 0;
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
}

#horseDetailsModal .modal-body {
    width: 100%;
    max-height: calc(100vh - 150px);
    padding: 14px;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

#horseDetailsContent,
#horseDetailsContent .portal-horse-details-modal {
    width: 100%;
    max-width: 100%;
    margin: 0;
}


/* HEADER */

.portal-horse-details-header {
    display: flex;
    align-items: center;
    gap: 14px;

    width: 100%;
    margin-bottom: 12px;
    padding: 14px;

    border: 1px solid #eee;
    border-radius: 14px;

    background: #fff;
}

.portal-horse-details-photo {
    flex: 0 0 76px;
    width: 76px;
    height: 76px;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;

    border: 1px solid #eee;
    border-radius: 14px;

    background: #f8f9fa;
}

.portal-horse-details-photo img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;

    object-fit: cover;
}

.portal-horse-details-title {
    flex: 1;
    min-width: 0;
}

.portal-horse-details-label {
    display: block;
    margin-bottom: 3px;

    color: var(--primary-color);

    font-size: 14px;
    font-weight: 600;
}

.portal-horse-details-title h4 {
    margin: 0;

    font-size: 18px;
    font-weight: 700;
}

.portal-horse-details-name-en {
    display: block;
    margin-top: 4px;

    color: #888;

    font-size: 14px;
}


/* SECTIONS */

.portal-horse-details-section {
    width: 100%;

    margin-bottom: 12px;
    padding: 13px;

    border: 1px solid #eee;
    border-radius: 13px;

    background: #fff;
}

.portal-horse-details-section-title {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-bottom: 12px;
    padding-bottom: 10px;

    border-bottom: 1px solid #f0f0f0;
}

.portal-horse-details-section-title > i {
    flex: 0 0 32px;

    width: 32px;
    height: 32px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 9px;

    background: rgba(92, 45, 145, .08);
    color: var(--primary-color);

    font-size: 14px;
}

.portal-horse-details-section-title strong,
.portal-horse-details-section-title small {
    display: block;
}

.portal-horse-details-section-title strong {
    font-size: 14px;
    font-weight: 700;
}

.portal-horse-details-section-title small {
    margin-top: 1px;

    color: #999;

    font-size: 14px;
}


/* GRID */

.portal-horse-details-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;

    width: 100%;
    margin-bottom: 0;
}

.portal-horse-details-item {
    min-width: 0;
    padding: 9px 10px;

    border-radius: 9px;

    background: #f8f9fa;
}

.portal-horse-details-item span,
.portal-horse-details-item strong {
    display: block;
}

.portal-horse-details-item span {
    margin-bottom: 3px;

    color: #999;

    font-size: 14px;
}

.portal-horse-details-item strong {
    color: #444;

    font-size: 14px;
    font-weight: 600;

    overflow-wrap: anywhere;
}

.portal-horse-details-item-wide {
    grid-column: 1 / -1;
}


/* PEDIGREE */

.portal-horse-pedigree {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;

    width: 100%;
}

.portal-horse-pedigree-item {
    display: flex;
    align-items: center;
    gap: 8px;

    min-width: 0;
    padding: 10px;

    border-radius: 10px;

    background: #f8f9fa;
}

.portal-horse-pedigree-icon {
    flex: 0 0 34px;

    width: 34px;
    height: 34px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 9px;

    background: #fff;
    color: var(--primary-color);
}

.portal-horse-pedigree-item span,
.portal-horse-pedigree-item strong {
    display: block;
}

.portal-horse-pedigree-item span {
    color: #999;
    font-size: 14px;
}

.portal-horse-pedigree-item strong {
    margin-top: 2px;

    font-size: 14px;
}


/* ACTION */

.portal-horse-details-actions {
    width: 100%;
    margin-top: 4px;
}

.portal-horse-participations-btn {
    width: 100%;
    min-height: 64px;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 10px 12px;

    border: 1px solid rgba(92,45,145,.15);
    border-radius: 12px;

    background: rgba(92,45,145,.045);
    color: var(--text-color);

    text-decoration: none !important;
}

.portal-horse-participations-main {
    display: flex;
    align-items: center;
    gap: 10px;
}

.portal-horse-participations-icon {
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 10px;

    background: rgba(92,45,145,.10);
    color: var(--primary-color);

    font-size: 15px;
}

.portal-horse-participations-main strong,
.portal-horse-participations-main small {
    display: block;
}

.portal-horse-participations-main strong {
    font-size: 14px;
    font-weight: 700;
}

.portal-horse-participations-main small {
    margin-top: 2px;

    color: #888;

    font-size: 14px;
}

.portal-horse-participations-arrow {
    color: var(--primary-color);
    font-size: 14px;
}





/* MOBILE */

@media (max-width: 575.98px) {

    #horseDetailsModal .modal-dialog {
        max-width: none;
        margin: 8px;
    }

    #horseDetailsModal .modal-body {
        max-height: calc(100vh - 110px);
        padding: 10px;
    }

    .portal-horse-details-header {
        gap: 11px;
        padding: 11px;
    }

    .portal-horse-details-photo {
        flex-basis: 62px;
        width: 62px;
        height: 62px;
    }

    .portal-horse-details-title h4 {
        font-size: 18px;
    }

    .portal-horse-details-section {
        padding: 11px;
    }

    .portal-horse-pedigree {
        grid-template-columns: 1fr;
    }

}
body.identity-portal #horseDetailsModal .modal-header {
    background: #fff !important;
    color: var(--text-color) !important;

    border-bottom: 1px solid #eee;
    border-radius: 16px 16px 0 0;
}

body.identity-portal #horseDetailsModal .modal-title,
body.identity-portal #horseDetailsModal .modal-header i,
body.identity-portal #horseDetailsModal .modal-header .close {
    color: var(--text-color) !important;
}

body.identity-portal #horseDetailsModal .modal-header .close {
    opacity: .65;
}




/* =====================================================
   HORSE PARTICIPATIONS PAGE
===================================================== */

.portal-horse-participations-page {
    max-width: 900px;
    margin: 0 auto;
    padding-bottom: 110px;
}


/* =====================================================
   HERO
===================================================== */

.portal-horse-participations-hero {
    display: flex;
    align-items: center;
    gap: 14px;

    margin-bottom: 18px;
    padding: 16px;

    border: 1px solid #eee;
    border-radius: 16px;

    background: #fff;

    box-shadow: 0 4px 18px rgba(0, 0, 0, .035);
}

.portal-horse-participations-logo {
    flex: 0 0 64px;

    width: 64px;
    height: 64px;

    display: flex;
    align-items: center;
    justify-content: center;
}

.portal-horse-participations-logo img {
    width: 100%;
    height: 100%;

    object-fit: contain;
}

.portal-horse-participations-hero-info {
    flex: 1;
    min-width: 0;
}

.portal-horse-participations-eyebrow {
    display: block;

    margin-bottom: 3px;

    color: var(--primary-color);

    font-size: 14px;
    font-weight: 600;
}

.portal-horse-participations-hero-info h3 {
    margin: 0 0 4px;

    font-size: 18px;
    font-weight: 700;
}

.portal-horse-participations-hero-info p {
    margin: 0;

    color: #888;

    font-size: 14px;
    line-height: 1.6;
}

.portal-horse-participations-count {
    flex: 0 0 auto;

    min-width: 65px;

    padding: 7px 10px;

    border-radius: 11px;

    background: rgba(92, 45, 145, .07);

    text-align: center;
}

.portal-horse-participations-count strong,
.portal-horse-participations-count span {
    display: block;
}

.portal-horse-participations-count strong {
    color: var(--primary-color);

    font-size: 18px;
}

.portal-horse-participations-count span {
    color: #888;

    font-size: 14px;
}


/* =====================================================
   LIST
===================================================== */

.portal-horse-participations-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}


/* =====================================================
   CARD
===================================================== */

.portal-horse-participation-card {
    padding: 14px;

    border: 1px solid #eee;
    border-radius: 14px;

    background: #fff;

    box-shadow: 0 4px 16px rgba(0,0,0,.03);
}


/* HEADER */

.portal-horse-participation-card-header {
    display: flex;
    align-items: center;
    gap: 10px;

    margin-bottom: 12px;
}

.portal-horse-participation-number {
    flex: 0 0 34px;

    width: 34px;
    height: 34px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 9px;

    background: rgba(92,45,145,.07);
    color: var(--primary-color);

    font-size: 14px;
    font-weight: 700;
}

.portal-horse-participation-title {
    flex: 1;
    min-width: 0;
}

.portal-horse-participation-title span {
    display: block;

    overflow: hidden;

    color: #888;

    font-size: 14px;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.portal-horse-participation-title h5 {
    margin: 2px 0 0;

    font-size: 16px;
    font-weight: 700;
}


/* RESULT */

.portal-horse-participation-result {
    flex: 0 0 auto;

    min-width: 72px;

    padding: 6px 8px;

    border-radius: 10px;

    text-align: center;
}

.portal-horse-participation-result span,
.portal-horse-participation-result small {
    display: block;
}

.portal-horse-participation-result span {
    font-size: 18px;
}

.portal-horse-participation-result small {
    margin-top: 1px;

    font-size: 14px;
}

.portal-horse-participation-result.first {
    background: rgba(255,193,7,.12);
}

.portal-horse-participation-result.second {
    background: rgba(108,117,125,.09);
}

.portal-horse-participation-result.third {
    background: rgba(181,101,29,.09);
}

.portal-horse-participation-result.normal,
.portal-horse-participation-result.none {
    background: #f8f9fa;
}


/* =====================================================
   META
===================================================== */

.portal-horse-participation-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;

    margin-bottom: 8px;
}

.portal-horse-participation-meta > div {
    display: flex;
    align-items: center;
    gap: 6px;

    min-width: 0;
    padding: 8px 9px;

    border-radius: 9px;

    background: #f8f9fa;
}

.portal-horse-participation-meta i {
    flex: 0 0 auto;

    color: var(--primary-color);

    font-size: 14px;
}

.portal-horse-participation-meta span {
    overflow: hidden;

    color: #666;

    font-size: 14px;

    text-overflow: ellipsis;
    white-space: nowrap;
}


/* =====================================================
   PEOPLE
===================================================== */

.portal-horse-participation-people {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.portal-horse-participation-person {
    min-width: 0;

    padding: 9px;

    border-radius: 9px;

    background: #fafafa;
}

.portal-horse-participation-person span,
.portal-horse-participation-person strong {
    display: block;
}

.portal-horse-participation-person span {
    margin-bottom: 2px;

    color: #999;

    font-size: 14px;
}

.portal-horse-participation-person strong {
    overflow: hidden;

    color: #444;

    font-size: 14px;

    text-overflow: ellipsis;
    white-space: nowrap;
}


/* =====================================================
   EMPTY
===================================================== */

.portal-horse-participations-empty {
    padding: 35px 15px;

    border: 1px solid #eee;
    border-radius: 16px;

    background: #fff;

    text-align: center;
}

.portal-horse-participations-empty-icon {
    width: 58px;
    height: 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin: 0 auto 12px;

    border-radius: 50%;

    background: rgba(92,45,145,.07);
    color: var(--primary-color);

    font-size: 21px;
}

.portal-horse-participations-empty h5 {
    margin-bottom: 4px;

    font-size: 16px;
}

.portal-horse-participations-empty p {
    margin: 0;

    color: #999;

    font-size: 14px;
}


/* =====================================================
   ACTIONS
===================================================== */

.portal-horse-participations-actions {
    margin-top: 18px;
}

.portal-horse-participations-back {
    min-height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;

    padding: 10px 14px;

    border: 1px solid #e5e5e5;
    border-radius: 10px;

    background: #fff;
    color: #555;

    font-size: 14px;
    font-weight: 600;

    text-decoration: none !important;
}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 575.98px) {

    .portal-horse-participations-page {
        padding-right: 12px;
        padding-left: 12px;
    }

    .portal-horse-participations-hero {
        gap: 10px;
        padding: 12px;

        border-radius: 14px;
    }

    .portal-horse-participations-logo {
        flex-basis: 54px;

        width: 54px;
        height: 54px;
    }

    .portal-horse-participations-hero-info h3 {
        font-size: 17px;
    }

    .portal-horse-participations-hero-info p {
        display: none;
    }

    .portal-horse-participations-count {
        min-width: 55px;
    }

    .portal-horse-participation-card {
        padding: 12px;
    }

    .portal-horse-participation-result {
        min-width: 62px;
    }

}