/*Common*/
.input_custom {
    color: black !important;
}

label.error {
    color: black;
    /*position: absolute;
    bottom: -13px;
    left: 38px;
    font-family: inherit;
    font-weight: 600;
    font-size: 14px;*/
}

.intro_inner {
    margin-top: 10px;
}

.form-control:disabled, .form-control[readonly] {
    color: black;
}

.form-control input, .form-control textarea, .form-control select {
    color: black !important;
}

/*Index*/
header {
    padding-top: 15px;
}

.header-notification-wrapper {
    display: flex;
    align-items: center;
}

    .header-notification-wrapper img {
        width: 20px;
    }

    .header-notification-wrapper marquee {
        font-size: 12px;
    }

#index_casino_product img {
    height: 224px;
    border-radius: 10px;
}

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

/*Register*/
.reg_form .form-control {
    color: black;
}

.reg_form .form_wrap {
    position: relative;
}

    .reg_form .form_wrap label.error {
        display: block !important;
        width: 190px;
        position: absolute;
        right: -200px;
        top: -5px;
    }

/*Product*/
.inn_product_wrap a img {
    height: -webkit-fill-available;
    object-fit: fill;
}

#product_box .prov-tab-div:last-child {
    display: none;
}

.tab_wrapper_inn.slot-wrap {
    display: contents;
}

.tab_wrapper-slots img {
    height: 49px;
}

/*Promotion*/
.filter-list li {
    padding: 6px 15px;
}

.promo {
    align-items: stretch;
}

.promo_box_wrap img {
    height: 209px;
    object-fit: contain;
}

.promo_box_wrap_a a {
    width: max-content;
}

.promo_box_wrap_inn p {
    font-size: 14px;
    line-height: 1.2;
    display: block !important;
    min-height: 84px;
}

.promo-modal-title {
    color: #996600;
}

.intro_inner {
    margin-top: 0;
    z-index: 1;
    max-width: 100%;
    position: absolute;
    top: 20px;
    text-align: center;
}

/*Deposit*/
.form-control {
    color: black !important;
}

/*Inbox*/
#inbox_modal .modal .chatMsg a {
    color: #996600;
    font-weight: bold;
}

#inbox_modal .wrapper {
    width: 100%;
}

/*VIP*/
ul.vip-tnc li {
    list-style-type: disc;
}

/*Account*/
.my-inbox {
    font-size: 10px;
}

@media (max-width: 999px) {
    header {
        height: 115px;
    }

    .t-header {
        margin-bottom: 50px;
    }

    /*Index*/
    #index_casino_product img {
         height: 250px; 
    }

    div#chat-widget-container {
        display: none;
        bottom: 45px !important;
    }

    #product_box .prov-tab-div {
        height: 0px;
    }
}


#ME-tab_modal {
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgb(0 0 0 / 50%);
    top: 0;
    left: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    display: none;
}

#ME-tab_modal.active {
    display: flex;
}

    #ME-tab_modal .modal_cont {
        background: #141414;
        position: relative;
        border-radius: 5px;
        border: 1px solid #000;
        padding: 20px;
        max-width: fit-content;
        margin: auto;
        top: 50%;
        transform: translateY(0%);
    }

#ME-tab_modal .close_btn {
    color: #fff;
    position: absolute;
    top: -3px;
    right: 4px;
    font-size: 18px;
    font-weight: 500;
    cursor: pointer;
    opacity: 0.5;
    transition: 0.2s;
}

    #ME-tab_modal .close_btn:hover {
        opacity: 1;
    }

#ME-tab_modal .qr_container {
    display: flex;
    gap: 20px;
}

    #ME-tab_modal .qr_container div {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
    }

        #ME-tab_modal .qr_container div button {
            width: 160px;
            border-radius: 5px;
            padding: 5px 0;
            border: none;
            background: linear-gradient(180deg, #d5a246, #f6d578);
            font-weight: 700;
            font-size: 16px;
        }

        #ME-tab_modal .qr_container div img {
            width: 240px;
        }

        #ME-tab_modal .qr_container div button img {
            width: 18px;
            margin-right: 5px;
        }

#ME-tab_modal table {
    color: #fff;
    border: 1px solid;
    margin: 20px 0 0;
    width: 100%;
}

    #ME-tab_modal table td {
        font-size: 12px;
        border: 1px solid;
        padding: 3px 6px;
    }

.app-reset-password {
    width: 120px;
    border-radius: 5px;
    padding: 5px 0;
    border: none;
    background: linear-gradient(180deg, #d5a246, #f6d578);
    font-weight: 600;
    font-size: 12px;
    margin-top: 10px;
}

#ME-tab_modal input {
    color: black;
}

/* =========================================================
   INBOX HEADER ACTION
   ========================================================= */

.inbox-action-header {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    padding: 18px 25px 15px !important;
}

.inbox-header-title {
    width: 100%;
    margin-bottom: 15px;
    color: #000;
    font-size: 15px;
    font-weight: 700;
}

    .inbox-header-title span {
        display: block;
        font-weight: 700;
    }

.inbox-action-bar {
    width: 100%;
    display: flex !important;
    align-items: center;
    justify-content: space-between !important;
    gap: 15px;
}

.inbox-selection-wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}

.inbox-select-option {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    cursor: pointer;
    color: #7682a5;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
}

    .inbox-select-option input,
    .inbox-history-table input[name="msg_checkbox"] {
        width: 16px;
        height: 16px;
        margin: 0;
        cursor: pointer;
        accent-color: #ffa466;
    }

.inbox-action-button-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin-left: auto;
}

.inbox-action-button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 34px;
    padding: 7px 14px !important;
    border: 0;
    border-radius: 8px;
    cursor: pointer;
    white-space: nowrap;
}

    .inbox-action-button i {
        font-size: 13px;
    }

.inbox-delete-selected-button {
    background: #ff5b5b !important;
    color: #fff !important;
}

    .inbox-delete-selected-button:hover,
    .inbox-delete-selected-button:focus {
        background: #e94b4b !important;
        color: #fff !important;
    }

/* =========================================================
   INBOX TABLE
   ========================================================= */

.inbox-history-table .inbox-check-column {
    width: 42px;
    min-width: 42px;
    text-align: center;
    vertical-align: middle;
}

.inbox-history-table .inbox-title {
    font-weight: 400 !important;
    cursor: pointer;
}

.inbox-history-table .inbox-message-row.unread .inbox-title {
    font-weight: 700 !important;
}

.inbox-history-table .inbox-message-row td {
    font-weight: 400;
}

.inbox-history-table .inbox-message-row.unread .inbox-title {
    font-weight: 700 !important;
}

.inbox-history-table .inbox-message-row.unread td {
    background: rgba(255, 164, 102, 0.08);
}

.inbox-new {
    display: none;
}

    .inbox-new.unread {
        display: inline-block;
        width: 7px;
        height: 7px;
        margin-right: 7px;
        border-radius: 50%;
        background: #ff5b5b;
        vertical-align: middle;
    }

.inbox-modal-title {
    font-weight: 700 !important;
}

@media (max-width: 767px) {

    .inbox-action-header {
        padding: 15px !important;
    }

    .inbox-action-bar {
        align-items: flex-start;
        flex-direction: column;
    }

    .inbox-selection-wrapper {
        width: 100%;
        justify-content: flex-start;
    }

    .inbox-action-button-wrapper {
        width: 100%;
        margin-left: 0;
        justify-content: flex-end;
    }

    .inbox-action-button {
        flex: 1;
    }
}

/* =========================================================
   INBOX LOAD MORE
   ========================================================= */

.inbox-load-more-wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 18px 10px 8px;
}

.inbox-load-more-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-width: 145px;
    min-height: 38px;
    padding: 8px 18px !important;
    border: 0;
    border-radius: 8px;
    cursor: pointer;
    white-space: nowrap;
}

    .inbox-load-more-button i {
        font-size: 12px;
    }

    .inbox-load-more-button:disabled {
        opacity: 0.6;
        cursor: not-allowed;
    }

/* Header logo - constrain size so it scales with the header regardless of
   the source image's native resolution (style.css only sets a width for
   .logo below the 999px breakpoint, leaving desktop unconstrained). */
.logo img {
    max-height: 70px;
    width: auto;
}