body {
}
.hbis {

}

.wn {
    color: #cd6263 !important;
    font-weight: 600;
    position: relative;
    padding-left: 20px;
    text-align: left;
}
.wn i {
    position: absolute;
    top: 3px;
    left: 0;
}
.gn {
    color: #2980b9 !important;
    font-style: italic !important;
    position: relative;
    padding-left: 20px;
    text-align: left;
}
.gn i {
    position: absolute;
    top: 3px;
    left: 0;
}
.cn {
    color: #4761b5 !important;
    font-weight: bold;
    position: relative;
    padding-left: 20px;
    text-align: left;
}

    .cn i {
        position: absolute;
        top: 3px;
        left: 0;
    }

.sub-header-title {
    padding: 0px 0px 15px 0 !important;
    font-weight: 600 !important;
    margin-bottom: 20px !important;
}

#tagSummary {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.custom-tag-badge {
    display: inline-block;
    margin: 4px 6px 4px 0;
    padding: 6px 12px;
    font-size: 13px;
    border-radius: 12px;
    background-color: #eef4fc;
    border: 1px solid #b0c4de;
    color: #2c3e50;
    font-weight: 500;
    opacity: 0;
    transform: translateY(10px);
    animation: fadeInUp 0.4s ease forwards;
}

@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}


.rli {
    font-size: 12px;
}

.codeandid {
    font-size: 12px;
    color: #8f8f8f;
    line-height: 20px;
}

.available-hours {
    border-bottom: 1px dashed #ccc;
    margin-bottom: 12px;
}
.available-hours:last-child {
    border-bottom: none;
    margin-bottom: 12px;
}
    .available-hours .group {

    }
.dailyOccupancy {
}
    .dailyOccupancy .restaurants .panel-heading {
        padding: 20px 0px !important;
    }
    .dailyOccupancy .restaurants .panel-body {
        padding: 20px 0px !important;
    }
        .dailyOccupancy .restaurants .panel-body .shift-title {
            font-weight: 600;
            font-size: 20px;
            color: #000;
        }

    .vertical-checkbox {
        margin-bottom: 15px;
        font-weight: normal !important;
        position: relative;
        padding-left: 25px;
        cursor: pointer;
    }
    .vertical-checkbox input {
        position: absolute;
        top: 0px;
        left: 0px;
    }

.hbn {
    font-size: 12px;
    color: #8f8f8f;
    margin-bottom: 0;
    display: block;
}

.overlayElement {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.6); /* Beyaz üstü %60 opaklık */
    z-index: 9999;
    cursor: not-allowed;
    border-radius: 8px; /* İsteğe bağlı: kenarları yumuşatır */
    backdrop-filter: blur(1px); /* İsteğe bağlı: hafif blur efekti */
}

.noShowColumn {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tableChange {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ca {
    position: relative;
}
    .ca .vc {
        font-size: 11px;
        color: #ffffff;
        /*position: absolute;*/
        display: inline-block;
        right: 0px;
        background-color: #dcc928;
        padding: 3px 8px;
        border-radius: 25px;
        font-weight: bold;
        float: right !important;
        margin-left: 20px;
    }
    .mb-0 {
        margin-bottom: 0px !important;
    }
div.sticky {
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 0;
}

div.sticky-g {
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 75px;
}

.dropdown-menu.inbox li a .subject .level {
    position: absolute;
    right: 15px;
    font-weight: 600;
    font-size: 18px;
}

.mb-bg-g {
    background-color: #efefef !important;
}

.w-100 {
    width: 100px !important;
}

.w-150
{
    width: 150px !important;
}

.w-200 {
    width: 200px !important;
}

#WaitlistDailySummary {

}

#waitlistCalendar, #waitlistCalendar .datepicker-inline, #waitlistCalendar table {
    width: 100% !important;
}

#waitlistCalendar .table-condensed > thead > tr > th, #waitlistCalendar .table-condensed > tbody > tr > th, #waitlistCalendar .table-condensed > tfoot > tr > th, #waitlistCalendar .table-condensed > thead > tr > td, #waitlistCalendar .table-condensed > tbody > tr > td, #waitlistCalendar .table-condensed > tfoot > tr > td {
    padding: 4px 4px !important;
    font-size: 15px !important;
}

.hbis span {
    display: inline-block;
    margin-left: 10px;
    padding-left: 10px;
    border-left: 1px solid #ddd;
}
    .hbis span:first-child{
        margin-left: 0px;
        border-left: 0px;
        padding-left: 0px;
    }

.cakeAndFlower {
    }
.cakeAndFlower span {
    margin-right: 15px;
     font-weight: 600;
}
    .cakeAndFlower .cake {
        color: #57c8f2;
    }
    .cakeAndFlower .flower {
        color: #106344;
    }
.cb {
    font-size: 12px !important;
}
.panel-heading-rezervem {
    padding: 10px 0px !important;
}

.panel-body-panel-heading-rezervem {
    padding: 20px 0px 0px !important;
}

.tab-bg-white .panel-body {
    padding-top: 10px !important;
}
.tab-bg-white .panel-heading {
    border-color: #ddd !important;
}

.tab-bg-white ul.nav {
    margin: -10px 0px -11px !important;
}

.tab-bg-white ul li {
}

    .tab-bg-white ul li:hover {
        color: #106344 !important;
    }

    .tab-bg-white ul li:first-child.active {
        border-left: none !important;
    }

    .tab-bg-white ul li:last-child.active {
        border-right: none !important;
    }

    .tab-bg-white ul li a {
        color: #666 !important;
        font-size: 14px !important;
        font-weight: 600 !important;
    }

        .tab-bg-white ul li a:hover {
            color: #106344 !important;
        }

    .tab-bg-white ul li.active {
        border-bottom: 2px solid #106344 !important;
        /*margin-bottom: 0px !important*/
    }

        .tab-bg-white ul li.active a {
            color: #106344 !important;
        }
.ui-widget-header {
    border: 1px solid #106344 !important;
    background-color: #106344 !important;
    color: #fff;
    font-weight: bold;
}
.ui-slider .ui-slider-handle{
    cursor: pointer !important;
}
.slider-info {
    padding-top: 10px;
    display: block !important;
}
.WalkInForm {
}
    .WalkInForm .guests button {
        margin-right: 5px;
    }
        .WalkInForm .guests button:last-child {
            margin-right: 0px !important;
        }
        .WalkInForm .guests button:hover, .WalkInForm .guests button:active {
            background-color: #106344;
            border-color: #106344;
            color: #FFFFFF;
        }
.prepaymentArea {
        width: 40px !important;
        background-repeat: no-repeat !important;
        background-position: center center !important;
    }
    .prepaymentArea.pw {
        background-image: url(/img/icons/icon-prepayment-waiting.png) !important;
    }
    .prepaymentArea.ps {
        background-image: url(/img/icons/icon-prepayment-success.png) !important;
    }
    .prepaymentArea.pr {
        background-image: url(/img/icons/icon-prepayment-refund.png) !important;
    }
    .prepaymentArea.cs {
        background-image: url(/img/icons/icon-payment-success.png) !important;
    }
    .prepaymentArea.cr {
        background-image: url(/img/icons/icon-payment-refund.png) !important;
    }
.report-table .help-block {
    font-size: 11px !important;
    font-weight: normal;
    margin-top: 0px !important;
}
.report-table tbody tr td {
}
#statusBar .panel-heading .panel-title {
    color: #666 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}
#statusBar .panel-heading .panel-title a {
    display: block !important;
}
.fwb {
    font-weight: bold !important;
}

.selectize-dropdown-content .client-option {
    border-bottom: 1px dashed #ccc;
    padding: 10px 10px !important;
}

    .selectize-dropdown-content .client-option:first-child {
        padding-top: 0 !important;
    }

    .selectize-dropdown-content .client-option:last-child {
        padding-bottom: 0 !important;
        border-bottom: none !important;
    }

table.dataTable thead .sorting:after {
    display: none !important;
}
/*table.dataTable thead > tr > th.sorting_asc, table.dataTable thead > tr > th.sorting_desc, table.dataTable thead > tr > th.sorting, table.dataTable thead > tr > td.sorting_asc, table.dataTable thead > tr > td.sorting_desc, table.dataTable thead > tr > td.sorting {
            padding-right: 10px !important;
        }*/

.form-control-center {
    width: auto !important;
    display: inline-block;
}

.btn-rezervem-border {
    border-color: #106344 !important;
}

.reportNoShowSummary, .reportCancelSummary {
    cursor: pointer;
}

.datepicker .datepicker-days table tr td.today {
    color: #fff !important;
    background-image: none !important;
    background-color: #9cb7ad !important;
    border-color: #106344 !important;
}

.datepicker .datepicker-days table tr td:hover {
    color: #fff !important;
    background-color: #106344 !important;
    border-color: #106344 !important;
}

#back-to-top {
    position: fixed;
    bottom: -70px;
    right: 30px;
    z-index: 9999;
    width: 64px;
    height: 64px;
    text-align: center;
    cursor: pointer;
    border: 0;
    text-decoration: none;
    transition: all .4s ease-out;
}

    #back-to-top.show {
        bottom: 30px;
    }

.full-width-modal {
    overflow-y: hidden !important;
}

.modal-dialog-full-width {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    max-width: none !important;
}

.modal-content-full-width {
    height: auto !important;
    min-height: 100% !important;
    border-radius: 0 !important;
    background-color: #fff !important
}

    .modal-content-full-width .modal-body {
        position: absolute;
        top: 64px;
        bottom: 60px;
        width: 100%;
        overflow-y: auto;
        overflow-x: hidden;
    }

.modal-header-full-width {
    /*border-bottom: 1px solid #9ea2a2 !important;*/
}

    .modal-header-full-width .close {
        margin-top: -15px !important;
        margin-right: 5px !important;
        font-size: 60px !important;
        font-weight: lighter !important;
        line-height: 60px !important;
        color: #343a40 !important;
    }

.modal-footer-full-width {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 60px;
}

.accountingTable {
}

    .accountingTable .tableNo, .accountingTable .guests {
        width: 50px !important;
        text-align: center;
    }

    .accountingTable .money {
        width: 80px !important;
        text-align: center;
    }

.batchStatusTable .time {
    width: 85px !important;
    text-align: center;
}

.batchStatusTable .guests {
    width: 45px !important;
    text-align: center;
}

.changeStatusButtons .help-block {
    margin-bottom: 10px !important;
    margin-top: 0px !important;
}

.first-visit {
    position: relative;
}

    .first-visit::before {
        /*content: attr(data-after-content);*/
        content: "\f02e";
        font-family: FontAwesome;
        position: absolute;
        right: 3%;
        font-size: 16px;
        font-weight: 600;
        line-height: 27px;
        color: #106344;
        text-align: center;
        /*border-radius: 0px 0 5px 5px;*/
    }

.second-visit {
    position: relative;
}

    .second-visit::before {
        content: attr(data-after-content);
        position: absolute;
        right: 3%;
        font-size: 12px;
        font-weight: 600;
        line-height: 27px;
        color: #fff;
        text-align: center;
        background: #b7b7b7;
    }

.btn-default:hover {
    background-color: #106344 !important;
    border-color: #106344 !important;
    color: #FFFFFF !important;
}

.pagination > li.active > a {
    background-color: #106344 !important;
    border-color: #106344 !important;
    color: #FFFFFF !important;
}

.text-gray {
    color: #b5b5b5 !important;
}

.modal-xl {
    width: 1200px !important;
}

#LastNotifications .body {
    padding-left: 30px;
    display: block;
}

#LastNotifications .help-block {
    padding-left: 30px;
    font-size: 11px !important;
}

.dropdown-menu.inbox li a .cc {
    font-weight: bold;
    padding-left: 44px;
    color: #ff6c60;
}

#ReservationSearchResultTable .note {
    display: inline-block;
    margin-top: 10px;
}

.fw-600 {
    font-weight: 600 !important;
}

.mt-1 {
    margin-top: 10px !important;
}

.pb-1 {
    padding-bottom: 10px !important;
}

.times pb-0 {
    padding-bottom: 7px !important;
}

.dropdown-menu.extended {
    /*left: -192px !important;*/
}

#header_inbox_bar {
    margin-top: 4px !important;
}

.notify-row {
    margin-top: 7px !important;
}

ul.top-menu > li > a {
    border: 1px solid #f0f0f8 !important;
}

#header_inbox_bar a.dropdown-toggle {
    font-size: 18px;
}

.table-condensed > thead > tr > th, .table-condensed > tbody > tr > th, .table-condensed > tfoot > tr > th, .table-condensed > thead > tr > td, .table-condensed > tbody > tr > td, .table-condensed > tfoot > tr > td {
    padding: 10px 15px !important;
}

.selectize-control.multi .selectize-input > div {
    background-color: #106344 !important;
    color: #fff !important
}

.form-control-rezervem {
    border-color: #106344 !important;
    margin-top: 0px !important;
    text-align: center !important;
    background-color: #fff !important;
}

.btn-rezervem {
    background-color: #106344;
    border-color: #106344;
    color: #FFFFFF;
}

    .btn-rezervem strong, .btn-rezervem span {
        border-top-color: #FFFFFF !important;
        color: #fff !important;
    }

    .btn-rezervem:hover, .btn-rezervem:focus, .btn-rezervem:active, .btn-rezervem.active, .open .dropdown-toggle.btn-rezervem {
        background-color: #217556;
        border-color: #217556;
        color: #FFFFFF !important;
    }

    .btn-rezervem .caret {
        color: #fff !important;
    }

.state-overview .value h1, .state-overview .value h2, .state-overview .value h3 {
    font-weight: 600 !important;
}

.state-overview .value h1, .state-overview .value h2, .state-overview .value h3, .state-overview .value p {
    color: #a0a3af !important;
}

#header_notification_bar {
    margin-top: 4px !important;
}

.notify-arrow {
    /*left: 200px !important;*/
}

.text-white {
    color: #fff !important;
}

.mr-1 {
    margin-right: 10px !important;
}

.mr-2 {
    margin-right: 20px !important;
}

.mt-2 {
    margin-top: 20px !important;
}

.ml-2 {
    margin-left: 20px !important;
}

.ml-3 {
    margin-left: 30px !important;
}

.ml-4 {
    margin-left: 40px !important;
}

.mb-2 {
    margin-bottom: 20px !important;
}

.pb-0 {
    padding-bottom: 0px !important;
}

.mlpl-0 {
    margin-left: 0px !important;
    padding-left: 0px !important;
    border-left: 0px !important;
}

.table-condensed > thead > tr > th, .table-condensed > tbody > tr > th, .table-condensed > tfoot > tr > th, .table-condensed > thead > tr > td, .table-condensed > tbody > tr > td, .table-condensed > tfoot > tr > td {
    padding: 10px 15px !important;
    font-size: 15px !important;
}

.tooltip {
    z-index: 1151 !important;
}

.btn-info .help-block {
    color: #fff !important;
}

.mci {
    margin-left: 15px !important;
    color: #b94a48 !important;
}

table tbody tr.selected td {
    background-color: #dff0d85e;
    font-weight: bold;
    text-align: center
}

.roomsAndTables .nav > li > a {
    padding: 10px 15px !important;
    font-size: 16px !important;
}

.roomsAndTables .tab-content .btn-white {
    border: 2px solid #e2e2e4;
    color: #444 !important;
}

    .roomsAndTables .tab-content .btn-white strong, .roomsAndTables .tab-content .btn-rezervem strong, .roomsAndTables .tab-content .btn-danger strong {
        font-weight: 600 !important;
    }

.roomsAndTables .tab-content .btn-white p {
    font-size: 22px !important;
    font-weight: bold;
    margin-bottom: 10px !important;
}

.roomsAndTables .tab-content .btn-rezervem p, .roomsAndTables .tab-content .btn-danger p, .roomsAndTables .tab-content .btn-warning p {
    color: #fff !important;
    font-size: 22px !important;
    font-weight: bold;
    margin-bottom: 10px !important;
}

.roomsAndTables .tab-content .btn-white:hover {
    color: #106344 !important;
    background-color: #fff !important;
    border: 2px solid #106344;
}

    .roomsAndTables .tab-content .btn-white:hover strong, .roomsAndTables .tab-content .btn-white:hover span {
        color: #106344 !important;
        /*color: #fff !important;*/
    }


.roomsAndTables .tab-content .btn-warning {
    color: #fff !important;
}

    .roomsAndTables .tab-content .btn-warning strong {
        color: #fff !important;
    }

    .roomsAndTables .tab-content .btn-warning:hover {
        color: #fff !important;
    }

        .roomsAndTables .tab-content .btn-warning:hover strong {
            color: #fff !important;
        }

.roomsAndTables .panel {
    box-shadow: none !important;
}

.roomsAndTables .panel-heading {
    background-color: #efefef !important;
    padding: 10px 15px !important;
    border-color: #dfdfdf !important;
}

    .roomsAndTables .panel-heading ul li a {
        color: #4a4a4a;
        font-size: 12px;
        font-weight: 600;
    }

    .roomsAndTables .panel-heading .nav > li.active > a, .roomsAndTables .panel-heading .nav > li > a:hover {
        color: #106344;
    }

    .roomsAndTables .panel-heading ul li.active a {
        font-weight: bold;
    }

.roomsAndTables .panel-body {
    /*padding: 15px 0 0 0 !important;*/
}

.cursorPointer {
    font-weight: normal !important;
    cursor: pointer !important;
    margin-right: 15px;
}

.changeStatusButtons label {
    font-weight: 600 !important;
    padding: 10px !important;
    margin: 0px !important;
    border: 2px solid #fff;
    border-radius: 10px;
    display: inline-block;
    min-width: 100px;
    cursor: pointer;
}

    .changeStatusButtons label:hover {
        border: 2px solid #e2e2e4;
    }

    .changeStatusButtons label.active {
        border: 2px solid #e2e2e4;
    }

.gift-True i {
    display: block !important;
    color: #b14ab9
}

.alert-gift {
    background-color: #864f8e !important;
    color: #fff !important;
}

    .alert-gift button {
        background-color: #fff !important;
        font-weight: bold
    }

.viewTypes {
}

    .viewTypes .active {
        background-color: #106344 !important;
        border-color: #106344 !important;
    }

.room-tables-fromHotel {
    /*text-align: center;*/
}

    .room-tables-fromHotel button {
        min-width: 50px !important;
        margin: 0px 3px 8px;
        font-size: 15px !important;
        padding: 10px 12px !important;
        font-weight: 600;
    }

    .room-tables-fromHotel .btn-white:hover {
        background-color: #106344;
        border-color: #106344;
        color: #FFFFFF;
    }

        .room-tables-fromHotel .btn-white:hover span, .room-tables-fromHotel .btn-danger span, .room-tables-fromHotel .btn-warning span {
            color: #FFFFFF;
        }

.state-overview-small {
}

.state-overview .symbol {
    width: 30% !important;
    padding: 20px 15px !important;
}

    .state-overview .symbol i {
        font-size: 24px !important;
    }

.state-overview .value {
    width: 70% !important;
    padding: 10px 0 !important;
}

    .state-overview .value h2 {
        font-size: 20px !important;
        font-weight: 600 !important;
    }

    .state-overview .value p {
        font-size: 14px !important;
    }

.state-overview .gold {
    background-color: #e2cb25;
}

.state-overview .gold-2 {
    background-color: #D6BE1D;
}

.state-overview .gold-3 {
    background-color: #C7B11B;
}

.state-overview .gold-4 {
    background-color: #BFAB1A;
}

.state-overview .gold-5 {
    background-color: #B9A51A;
}

#NoShowActionForm {
}

.small-overview {
}

    .small-overview .symbol {
        width: 30% !important;
        padding: 20px 15px !important;
    }

    .small-overview .value {
        width: 70% !important;
        padding-top: 13px !important;
    }

        .small-overview .value p {
            font-size: 13px !important;
        }

    .small-overview .symbol i {
        font-size: 30px !important;
    }

.small-dash {
}

    .small-dash span {
        padding-left: 15px;
        margin-left: 15px;
        border-left: 1px solid #ccc;
    }

        .small-dash span i {
            color: #999
        }

        .small-dash span:first-child {
            padding-left: 0;
            margin-left: 0;
            border-left: none;
        }

.search-filters {
    padding-bottom: 15px;
    border-bottom: 1px dashed darkgrey;
    margin-bottom: 20px;
}

.tables {
    text-align: center;
}

    .tables button {
        border-radius: 5px;
        padding: 10px 15px;
        margin: 0px 2px 8px;
        min-width: 74px !important;
        font-size: 15px !important;
    }

        .tables button span {
            color: #fff !important;
        }

        .tables button .btn-white span {
            color: #dff0d85e !important;
        }

        .tables button:hover {
            background-color: #106344;
            border-color: #106344;
            color: #FFFFFF;
        }

.search-filters h4 {
    margin: 2px 15px 0 0;
}

.search-filters button {
    margin-bottom: 5px !important;
}

.personal-report .summary-list li {
    width: 19.5%;
}

.personal-report .user-heading.alt .profile {
    line-height: 94px !important;
}

.tooltip-wrapper {
    display: inline-block;
    float: left;
}

.btn-default .caret {
    border-top-color: #fff !important;
}

.btn-toolbar .pagination > li > a {
    font-size: 15px;
}

.client-title {
    font-weight: 600 !important;
}

ReservationTable_filter {
    display: none;
}

.tooltip-wrapper .btn {
    border-radius: 0;
}

.tooltip-wrapper:first-child .btn {
    border-radius: 3px 0 0 3px;
}

.tooltip-wrapper:last-child .btn {
    border-radius: 0 3px 3px 0;
}

.top-info {
    float: left;
    margin-top: 20px;
    margin-left: 30px;
}

.error, .selectized.error + div.not-full {
    border: 1px solid #a94442 !important;
}

.datepicker table tr td.active.active, .datepicker table tr td.active.highlighted.active, .datepicker table tr td.active.highlighted:active, .datepicker table tr td.active:active {
    background-color: #106344 !important;
    border-color: #106344 !important;
}

.hide-and-validate {
    visibility: hidden !important;
    position: absolute !important;
}

.custom-summary-list .summary-list li {
    width: 48.5%;
}

ul.summary-list > li > i {
    display: block;
    font-size: 35px;
    padding-bottom: 5px;
}

ul.summary-list > li {
    padding: 10px 0;
    display: inline-block;
    color: #818181;
}

/* CSS Custom */
.state-overview .symbol i.wait {
    color: #6ccac9;
    font-size: 18px;
    position: relative;
    left: -44px;
    top: -6px;
}

.state-overview .symbol i.process {
    color: #ff6c60;
    font-size: 18px;
    position: relative;
    left: -49px;
    top: -5px;
}

.state-overview .symbol i.testing {
    color: #f8d347;
    font-size: 18px;
    position: relative;
    left: -49px;
    top: -5px;
}

.adv-table .dataTables_filter label input {
    margin-right: 10px;
    width: 60%;
}

.modal-body .form-horizontal .form-group {
    margin-left: 0;
    margin-right: 0;
}

.align-right {
    text-align: right;
}

    .align-right .btn {
        margin-right: 5px;
    }

.notification-notification .text {
    white-space: normal;
    display: inline-block;
    margin-left: 10px;
    width: 180px;
}

/*.select-new-client, .select-new-device { position: absolute;top: 6px;left: 400px;display: none;}*/
.select-new-client {
}

.isNew {
    font-weight: bold;
}

.service-records tr.item, .maintenance-records tr.item, .clients tr.item {
    cursor: pointer;
}

input.error, textarea.error, select.has-error {
    border-color: #a94442;
}

.input-validation-error {
    border-color: #a94442 !important;
}

span.has-error, .field-validation-error {
    color: #a94442;
    margin-top: 5px;
    display: block;
}

p.has-error {
    color: #a94442;
    margin-top: 5px;
}

.filter-label {
    font-size: 15px;
    font-weight: normal;
}

.btn-active {
    background-color: #6ccac9;
    border-color: #6ccac9;
}

.dotted-line {
    border-bottom: dotted 1px #e0e0e0;
    margin-bottom: 15px;
    padding-bottom: 20px;
    display: block;
}

.price {
    font-size: 18px;
}


/*Social buttons*/
.btn-facebook i {
    color: #fff;
    margin-right: 10px;
}

.btn-facebook {
    background: #3b5998;
    color: #fff !important;
    border: 1px solid rgba(0, 0, 0, 0.08);
}

.m-left-20 {
    margin-left: 20px !important;
}

.m-left-10 {
    margin-left: 10px !important;
}

.m-bot-20 {
    margin-bottom: 20px !important;
}


.brand-list {
}

    .brand-list li {
        padding: 11px 0 !important;
        border-bottom: 1px #e5e5e5 dashed !important;
        line-height: 24px;
    }

        .brand-list li:last-child {
            border-bottom: none !important;
        }

        .brand-list li span {
            float: right !important;
        }

.add-btn {
    /*background-color: #737373 !important;
    border-color: #737373 !important;*/
    color: #434343;
}

.items tbody tr {
    cursor: pointer !important;
}

.selectize-control .el {
    margin-right: 15px !important;
}

.selectize-control .help-block {
    font-size: 12px;
    color: #666;
}

.form-group p:last-child {
    margin-bottom: 0px !important;
}

.form-group div p:last-child {
    margin-bottom: 0px !important;
}

.row .col-xs-12:last-child {
    margin-bottom: 0px !important;
}

.form-group label.checkbox-inline:first-child {
    padding-left: 0px !important;
}

.tags .item {
    margin-bottom: 10px;
}

    .tags .item label {
        margin-bottom: 0px !important;
    }

    .tags .item:nth-last-child(-n+3) {
        margin-bottom: 0px !important;
    }

.showHidePanel .panel-heading {
    cursor: pointer;
}

.showHidePanel .panel-body {
    display: none;
}

.cp {
    cursor: pointer !important;
}

.panel-heading .nav > li.active > a, .panel-heading .nav > li > a:hover {
    color: #106344 !important;
    font-weight: 600 !important;
}

.amountCalculateTypePanel {
}

.amountCalculateTypePanel label {
    font-weight: normal !important;
}

.amountCalculateTypePanel .input-group {
    width: 150px !important;
    margin-top: 15px !important;
}

.paymentRefund {
    font-weight: bold !important;
}

.center-block {
    display: table; /* Instead of display:block */
    margin-left: auto;
    margin-right: auto;
}

@media (max-width: 390px) {
    a.logo {
        display: none;
    }
}

@media (min-width: 992px) {
    .modal-lg {
        width: 900px;
    }
}

@media (max-width: 768px) {
    .modal-lg, .modal-xl, .modal-sm {
        width: 758px !important;
    }
}

@media (width: 1024px) {
    .modal-lg, .modal-xl, .modal-sm {
        width: 1010px !important;
    }
}

@media (min-width: 991px) {
}

@media (max-width: 1025px) {
    .wrapper {
        padding: 25px 10px !important;
    }

    .state-overview .symbol {
        width: 30% !important;
        padding: 20px 15px !important;
    }

    .state-overview .value {
        width: 70% !important;
        padding-top: 13px !important;
    }

        .state-overview .value p {
            font-size: 12px !important;
        }

        .state-overview .value h2 {
            font-size: 20px !important;
        }

    .state-overview .symbol i {
        font-size: 20px !important;
    }
}

.dateButtons {
}

    .dateButtons .btn-xs, .dateButtons .btn-sm {
        margin: 0 0px 4px 0;
        padding: 8px 12px !important;
        font-size: 15px !important;
        font-weight: 600;
    }
        .dateButtons .btn-xs:hover, .dateButtons .btn-sm:hover {
            background-color: #217556;
            border-color: #217556;
            color: #FFFFFF !important;
        }



.persons .btn-sm {
    margin: 0 0px 5px 0;
    text-align: center;
    width: 35.73px;
}

.reservations tbody tr td.noShow span.badge {
    position: relative;
    top: 0px;
    left: 0px;
    z-index: 10;
}


.mt-0 {
    margin-top: 0px !important;
}

.mb-1 {
    margin-bottom: 5px !important;
}


.pt-15 {
    padding-top: 15px !important;
}

.pt-25 {
    padding-top: 25px !important;
}

.newReservationFromPMS {
    
}
    .newReservationFromPMS .btn-white:hover {
        border-color: #106344 !important;
        color: #106344 !important;
        font-weight: normal;
    }
    .newReservationFromPMS .btn-white:active, .newReservationFromPMS .btn-white:focus {
        border-color: #106344 !important;
        background-color: #106344 !important;
        color: #fff !important;
        font-weight: normal;
    }
    .newReservationFromPMS .btn-white.active {
        border-color: #106344 !important;
        background-color: #106344 !important;
        color: #fff !important;
        font-weight: normal !important;
    }
    .newReservationFromPMS .panel-heading {
        padding: 0 0 5px !important;
    }
    .newReservationFromPMS .available-dates .btn {
        margin-bottom: 5px;
    }

    .newReservationFromPMS .restaurantList button {
        margin-bottom: 5px !important;
    }

    .spinner {
        display: block;
        width: 16px;
        height: 16px;
        border: 2px solid #fff;
        border-radius: 50%;
        border-top-color: #ccc;
        animation: spin 1s linear infinite;
        margin: auto;
    }

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}



/* Gün hücresi için relative konumlandırma */
.datepicker-days td {
    position: relative; /* Noktayı hücreye göre konumlandırabilmek için */
    /*padding-bottom: 10px;*/ /* Alt kısımda nokta için boşluk bırak */
}

/* Rezervasyon olan günler için yeşil nokta */
.reservation-day::after {
    content: '●';
    color: green;
    font-size: 12px;
    position: absolute;
    bottom: 0px;
    right: 5px;
}

/* Kapalı günler için kırmızı nokta */
.closed-day::before {
    content: '●';
    color: red;
    font-size: 12px;
    position: absolute;
    bottom: 10px;
    right: 5px;
}

/* Rezervasyon olmayan günler için gri nokta */
.no-b-day::after {
    content: '●';
    color: gray;
    font-size: 12px;
    position: absolute;
    bottom: 0px;
    right: 5px;
}

.waiterSelect button {
    margin: 0px 3px 8px;
    font-weight: 600;
}
    .waiterSelect button:hover {
        border-color: #106344;
    }

.tableCellButtons {
    display: table;
    table-layout: fixed;
    width: 100%;
}

    .tableCellButtons .btn {
        display: table-cell;
        float: none; /* Bootstrap’ın float’ını iptal eder */
        text-align: center; /* Dilersen metni ortala */
        vertical-align: middle;
        padding: 10px 12px !important;
        margin: 0 4px 8px
        /* Eğer arada boşluk istersen: */
        /* border-right: 1px solid #e1e1e1; */
    }
        .tableCellButtons .btn:hover {
            background-color: #106344 !important;
            border-color: #106344 !important;
            color: #FFFFFF !important;
        }

/* Pricing Rules - Highlight Animation */
.highlighted-rule {
    animation: highlightFade 3s ease-in-out;
}

@keyframes highlightFade {
    0% {
        background-color: #fff3cd;
        box-shadow: 0 0 10px rgba(255, 193, 7, 0.5);
    }
    50% {
        background-color: #fff3cd;
        box-shadow: 0 0 10px rgba(255, 193, 7, 0.5);
    }
    100% {
        background-color: transparent;
        box-shadow: none;
    }
}

/* WhatsApp Business Cloud Progress Bar - Yüzdelik bilgiyi dikey olarak ortalama */
#OverallProgressBar {
    line-height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Rezervasyon Etiketleri - Alternatif 6 */
.tags .badge {
    display: inline-block;
    margin: 2px;
    padding: 3px 8px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    border-radius: 4px;
    background-color: #FAF5FF;
    border: 1px solid #E9D5FF;
    color: #7C3AED;
}

.tags .badge:hover {
    background-color: #E9D5FF;
    border-color: #DDD6FE;
    color: #6D28D9;
}

/* Misafir Etiketleri */
.client-tags {
    margin-top: 10px;
    margin-bottom: 5px;
}
.client-tags .badge {
    display: inline-block;
    margin: 2px;
    padding: 3px 8px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    border-radius: 4px;
    background-color: #DBEAFE;
    border: 1px solid #BFDBFE;
    color: #1E40AF;
}

.client-tags .badge:hover {
    background-color: #BFDBFE;
    border-color: #93C5FD;
    color: #1E3A8A;
}

/* Misafir Etiketleri Selectize - Seçili item'lar mavi arka plan */
/* Selectize, select elementinin yanına .selectize-control div'i ekler */
/* client-tags-selectize class'ı ile özel stil - hem .item hem de div için */
select.client-tags-selectize ~ .selectize-control.multi .selectize-input > .item,
select.client-tags-selectize ~ .selectize-control.multi .selectize-input > div.item,
select.client-tags-selectize ~ .selectize-control.multi .selectize-input > div[data-value] {
    background-color: #3B82F6 !important;
    background: #3B82F6 !important;
    border-color: #2563EB !important;
    color: #FFFFFF !important;
}

/* Active state için de mavi (selectize default'ta yeşil #92c836) */
select.client-tags-selectize ~ .selectize-control.multi .selectize-input > .item.active,
select.client-tags-selectize ~ .selectize-control.multi .selectize-input > div.item.active,
select.client-tags-selectize ~ .selectize-control.multi .selectize-input > div[data-value].active {
    background-color: #3B82F6 !important;
    background: #3B82F6 !important;
    border-color: #2563EB !important;
    color: #FFFFFF !important;
}

/* Hover durumu */
select.client-tags-selectize ~ .selectize-control.multi .selectize-input > .item:hover,
select.client-tags-selectize ~ .selectize-control.multi .selectize-input > div.item:hover,
select.client-tags-selectize ~ .selectize-control.multi .selectize-input > div[data-value]:hover {
    background-color: #2563EB !important;
    background: #2563EB !important;
    border-color: #1D4ED8 !important;
    color: #FFFFFF !important;
}

/* #ClientTags ID'si için mavi renk (CreateFromPhone.cshtml'de misafir etiketleri için) */
#ClientTags ~ .selectize-control.multi .selectize-input > .item,
#ClientTags ~ .selectize-control.multi .selectize-input > div.item,
#ClientTags ~ .selectize-control.multi .selectize-input > div[data-value] {
    background-color: #3B82F6 !important;
    background: #3B82F6 !important;
    border-color: #2563EB !important;
    color: #FFFFFF !important;
}

#ClientTags ~ .selectize-control.multi .selectize-input > .item.active,
#ClientTags ~ .selectize-control.multi .selectize-input > div.item.active,
#ClientTags ~ .selectize-control.multi .selectize-input > div[data-value].active {
    background-color: #3B82F6 !important;
    background: #3B82F6 !important;
    border-color: #2563EB !important;
    color: #FFFFFF !important;
}

#ClientTags ~ .selectize-control.multi .selectize-input > .item:hover,
#ClientTags ~ .selectize-control.multi .selectize-input > div.item:hover,
#ClientTags ~ .selectize-control.multi .selectize-input > div[data-value]:hover {
    background-color: #2563EB !important;
    background: #2563EB !important;
    border-color: #1D4ED8 !important;
    color: #FFFFFF !important;
}

/* ============================================
   ETİKET RENK ALTERNATİFLERİ
   ============================================
   Aşağıdaki alternatifler ileride kullanılmak üzere kaydedilmiştir.
   Aktif olan: Alternatif 1
   ============================================ */

/* ALTERNATİF 1 (AKTİF)
   Misafir: background: #DBEAFE; color: #1E40AF; border: #BFDBFE;
   Rezervasyon: background: #EDE9FE; color: #7C3AED; border: #DDD6FE;
*/

/* ALTERNATİF 2
   Misafir: background: #CFFAFE; color: #0E7490; border: #A5F3FC;
   Rezervasyon: background: #FCE7F3; color: #BE185D; border: #FBCFE8;
*/

/* ALTERNATİF 3
   Misafir: background: #BAE6FD; color: #075985; border: #7DD3FC;
   Rezervasyon: background: #F3E8FF; color: #7E22CE; border: #E9D5FF;
*/

/* ALTERNATİF 4
   Misafir: background: #E0E7FF; color: #4338CA; border: #C7D2FE;
   Rezervasyon: background: #F5F3FF; color: #6D28D9; border: #EDE9FE;
*/

/* ALTERNATİF 5
   Misafir: background: #DBEAFE; color: #1D4ED8; border: #93C5FD;
   Rezervasyon: background: #FAE8FF; color: #A21CAF; border: #F0ABFC;
*/

/* ALTERNATİF 6
   Misafir: background: #CCFBF1; color: #0F766E; border: #99F6E4;
   Rezervasyon: background: #FAF5FF; color: #7C3AED; border: #E9D5FF;
*/

/* ALTERNATİF 7 - Lime Green & Coral
   Misafir: background: #D9F99D; color: #3F6212; border: #BEF264;
   Rezervasyon: background: #FED7AA; color: #C2410C; border: #FDBA74;
*/

/* ALTERNATİF 8 - Mint Green & Peach
   Misafir: background: #D1FAE5; color: #065F46; border: #A7F3D0;
   Rezervasyon: background: #FEE2E2; color: #991B1B; border: #FECACA;
*/

/* ALTERNATİF 9 - Lemon Yellow & Salmon
   Misafir: background: #FEF3C7; color: #92400E; border: #FDE68A;
   Rezervasyon: background: #FECDD3; color: #BE123C; border: #FDA4AF;
*/

/* ALTERNATİF 10 - Sage Green & Lavender
   Misafir: background: #D1FAE5; color: #047857; border: #6EE7B7;
   Rezervasyon: background: #E9D5FF; color: #7E22CE; border: #D8B4FE;
*/

/* ALTERNATİF 11 - Amber & Rose
   Misafir: background: #FDE68A; color: #78350F; border: #FCD34D;
   Rezervasyon: background: #FBCFE8; color: #9F1239; border: #F9A8D4;
*/

/* ALTERNATİF 12 - Seafoam & Tangerine
   Misafir: background: #CCFBF1; color: #134E4A; border: #99F6E4;
   Rezervasyon: background: #FFEDD5; color: #9A3412; border: #FED7AA;
*/

/* ALTERNATİF 13 - Pale Yellow & Sky
   Misafir: background: #FEF9C3; color: #713F12; border: #FEF08A;
   Rezervasyon: background: #BAE6FD; color: #075985; border: #7DD3FC;
*/

/* ALTERNATİF 14 - Pistachio & Blush
   Misafir: background: #DCFCE7; color: #14532D; border: #BBF7D0;
   Rezervasyon: background: #FCE7F3; color: #9D174D; border: #FBCFE8;
*/

/* ALTERNATİF 15 - Honey & Lilac
   Misafir: background: #FED7AA; color: #7C2D12; border: #FDBA74;
   Rezervasyon: background: #E9D5FF; color: #6B21A8; border: #D8B4FE;
*/

/* ALTERNATİF 16 - Cyan & Crimson
   Misafir: background: #CFFAFE; color: #164E63; border: #A5F3FC;
   Rezervasyon: background: #FFE4E6; color: #9F1239; border: #FECDD3;
*/

/* ALTERNATİF 17 - Chartreuse & Mauve
   Misafir: background: #ECFCCB; color: #365314; border: #D9F99D;
   Rezervasyon: background: #F5D0FE; color: #86198F; border: #F0ABFC;
*/

/* ALTERNATİF 18 - Apricot & Periwinkle
   Misafir: background: #FFEDD5; color: #7C2D12; border: #FED7AA;
   Rezervasyon: background: #C7D2FE; color: #3730A3; border: #A5B4FC;
*/

/* ALTERNATİF 19 - Emerald & Coral
   Misafir: background: #D1FAE5; color: #064E3B; border: #A7F3D0;
   Rezervasyon: background: #FED7AA; color: #9A3412; border: #FDBA74;
*/

/* ALTERNATİF 20 - Butter & Plum
   Misafir: background: #FEF3C7; color: #854D0E; border: #FDE68A;
   Rezervasyon: background: #F5D0FE; color: #701A75; border: #F0ABFC;
*/

/* ALTERNATİF 21 - Aquamarine & Peach
   Misafir: background: #A7F3D0; color: #064E3B; border: #6EE7B7;
   Rezervasyon: background: #FED7AA; color: #7C2D12; border: #FDBA74;
*/

/* ALTERNATİF 22 - Lemon & Berry
   Misafir: background: #FEF08A; color: #713F12; border: #FDE047;
   Rezervasyon: background: #FDA4AF; color: #881337; border: #FB7185;
*/

/* ALTERNATİF 23 - Mint & Raspberry
   Misafir: background: #BBF7D0; color: #14532D; border: #86EFAC;
   Rezervasyon: background: #FECDD3; color: #9F1239; border: #FDA4AF;
*/

/* ALTERNATİF 24 - Canary & Orchid
   Misafir: background: #FDE047; color: #713F12; border: #FACC15;
   Rezervasyon: background: #E9D5FF; color: #6B21A8; border: #D8B4FE;
*/

/* ============================================
   ETİKET RENK CLASS'LARI - RENK BAZLI İSİMLENDİRME
   ============================================
   Kullanım: <span class="tag-blue-1a">Mavi Etiket</span>
            <span class="tag-green-2b">Yeşil Etiket</span>
            <span class="tag-purple-1a">Mor Etiket</span>
            <span class="tag-red-1a">Kırmızı Etiket</span>
   
   Format: tag-{renk}-{numara}a veya tag-{renk}-{numara}b
   Renk grupları: blue, green, purple, red, pink, yellow, amber, orange, coral, teal, cyan, mauve, cream
   Her renk grubu için numaralandırılmış varyantlar mevcuttur (a ve b)
   ============================================ */

/* Genel etiket stili - Tüm renk alternatifleri için ortak */
[class^="tag-blue-"], [class^="tag-green-"], [class^="tag-purple-"], 
[class^="tag-red-"], [class^="tag-pink-"], [class^="tag-yellow-"], 
[class^="tag-amber-"], [class^="tag-orange-"], [class^="tag-coral-"], 
[class^="tag-teal-"], [class^="tag-cyan-"], [class^="tag-mauve-"], 
[class^="tag-cream-"] {
    display: inline-block;
    margin: 2px;
    padding: 3px 8px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    border-radius: 4px;
    border: 1px solid;
}

/* ========== MAVİ TONLARI ========== */

/* Baby Blue */
.tag-blue-1a {
    background-color: #DBEAFE;
    color: #1E40AF;
    border-color: #BFDBFE;
}

/* Sky Blue */
.tag-blue-2a {
    background-color: #BAE6FD;
    color: #075985;
    border-color: #7DD3FC;
}

/* Powder Blue */
.tag-blue-3a {
    background-color: #DBEAFE;
    color: #1D4ED8;
    border-color: #93C5FD;
}

/* Koyu Mavi */
.tag-blue-4a {
    background-color: #BFDBFE;
    color: #1E3A8A;
    border-color: #93C5FD;
}

/* Açık Mavi */
.tag-blue-5a {
    background-color: #E0F2FE;
    color: #0C4A6E;
    border-color: #BAE6FD;
}

/* Mavi */
.tag-blue-6a {
    background-color: #DBEAFE;
    color: #1D4ED8;
    border-color: #93C5FD;
}

/* ========== MOR/LAVANTA TONLARI ========== */

/* Soft Lavender */
.tag-purple-1a {
    background-color: #EDE9FE;
    color: #7C3AED;
    border-color: #DDD6FE;
}

/* Orchid */
.tag-purple-2a {
    background-color: #F3E8FF;
    color: #7E22CE;
    border-color: #E9D5FF;
}

/* Periwinkle */
.tag-purple-3a {
    background-color: #E0E7FF;
    color: #4338CA;
    border-color: #C7D2FE;
}

/* Lilac */
.tag-purple-4a {
    background-color: #F5F3FF;
    color: #6D28D9;
    border-color: #EDE9FE;
}

/* Violet */
.tag-purple-5a {
    background-color: #FAF5FF;
    color: #7C3AED;
    border-color: #E9D5FF;
}

/* Lavender */
.tag-purple-6a {
    background-color: #E9D5FF;
    color: #7E22CE;
    border-color: #D8B4FE;
}

/* Orchid (Alternatif) */
.tag-purple-7a {
    background-color: #E9D5FF;
    color: #6B21A8;
    border-color: #D8B4FE;
}

/* Periwinkle (Alternatif) */
.tag-purple-8a {
    background-color: #C7D2FE;
    color: #3730A3;
    border-color: #A5B4FC;
}

/* Mor */
.tag-purple-9a {
    background-color: #F5F3FF;
    color: #6D28D9;
    border-color: #EDE9FE;
}

/* ========== CYAN TONLARI ========== */

/* Mint Blue / Cyan */
.tag-cyan-1a {
    background-color: #CFFAFE;
    color: #0E7490;
    border-color: #A5F3FC;
}

/* Cyan */
.tag-cyan-2a {
    background-color: #CFFAFE;
    color: #164E63;
    border-color: #A5F3FC;
}

/* Cyan (Alternatif) */
.tag-cyan-3a {
    background-color: #CFFAFE;
    color: #164E63;
    border-color: #A5F3FC;
}

/* ========== PEMBE TONLARI ========== */

/* Rose Purple */
.tag-pink-1a {
    background-color: #FCE7F3;
    color: #BE185D;
    border-color: #FBCFE8;
}

/* Rose */
.tag-pink-2a {
    background-color: #FBCFE8;
    color: #9F1239;
    border-color: #F9A8D4;
}

/* Blush */
.tag-pink-3a {
    background-color: #FCE7F3;
    color: #9D174D;
    border-color: #FBCFE8;
}

/* Salmon */
.tag-pink-4a {
    background-color: #FECDD3;
    color: #BE123C;
    border-color: #FDA4AF;
}

/* Berry */
.tag-pink-5a {
    background-color: #FDA4AF;
    color: #881337;
    border-color: #FB7185;
}

/* Raspberry */
.tag-pink-6a {
    background-color: #FECDD3;
    color: #9F1239;
    border-color: #FDA4AF;
}

/* Pembe */
.tag-pink-7a {
    background-color: #FCE7F3;
    color: #BE185D;
    border-color: #FBCFE8;
}

/* Pembe (Alternatif) */
.tag-pink-8a {
    background-color: #FBCFE8;
    color: #9D174D;
    border-color: #F9A8D4;
}

/* Magenta */
.tag-pink-9a {
    background-color: #FCE7F3;
    color: #BE185D;
    border-color: #F9A8D4;
}

/* ========== YEŞİL TONLARI ========== */

/* Lime Green */
.tag-green-1a {
    background-color: #D9F99D;
    color: #3F6212;
    border-color: #BEF264;
}

/* Mint Green */
.tag-green-2a {
    background-color: #D1FAE5;
    color: #065F46;
    border-color: #A7F3D0;
}

/* Sage Green */
.tag-green-3a {
    background-color: #D1FAE5;
    color: #047857;
    border-color: #6EE7B7;
}

/* Pistachio */
.tag-green-4a {
    background-color: #DCFCE7;
    color: #14532D;
    border-color: #BBF7D0;
}

/* Aquamarine */
.tag-green-5a {
    background-color: #A7F3D0;
    color: #064E3B;
    border-color: #6EE7B7;
}

/* Mint */
.tag-green-6a {
    background-color: #BBF7D0;
    color: #14532D;
    border-color: #86EFAC;
}

/* Koyu Yeşil */
.tag-green-7a {
    background-color: #D5EBE1;
    color: #1B5E42;
    border-color: #B8DCC8;
}

/* Açık Yeşil */
.tag-green-8a {
    background-color: #E8F5E9;
    color: #2E7D32;
    border-color: #C8E6C9;
}

/* Nane Yeşili */
.tag-green-9a {
    background-color: #D1FAE5;
    color: #065F46;
    border-color: #A7F3D0;
}

/* Zeytin Yeşili */
.tag-green-10a {
    background-color: #ECFCCB;
    color: #365314;
    border-color: #D9F99D;
}

/* Emerald */
.tag-green-11a {
    background-color: #D1FAE5;
    color: #064E3B;
    border-color: #A7F3D0;
}

/* Koyu Yeşil (Alternatif) */
.tag-green-12a {
    background-color: #D5EBE1;
    color: #155238;
    border-color: #B8DCC8;
}

/* Açık Yeşil (Alternatif) */
.tag-green-13a {
    background-color: #E8F5E9;
    color: #1B5E20;
    border-color: #C8E6C9;
}

/* ========== TURKUAZ TONLARI ========== */

/* Teal */
.tag-teal-1a {
    background-color: #CCFBF1;
    color: #0F766E;
    border-color: #99F6E4;
}

/* Seafoam */
.tag-teal-2a {
    background-color: #CCFBF1;
    color: #134E4A;
    border-color: #99F6E4;
}

/* Turkuaz */
.tag-teal-3a {
    background-color: #CCFBF1;
    color: #0F766E;
    border-color: #5EEAD4;
}

/* ========== KIRMIZI TONLARI ========== */

/* Crimson */
.tag-red-1a {
    background-color: #FFE4E6;
    color: #9F1239;
    border-color: #FECDD3;
}

/* Kırmızı */
.tag-red-2a {
    background-color: #FEE2E2;
    color: #7F1D1D;
    border-color: #FECACA;
}

/* Peach */
.tag-red-3a {
    background-color: #FEE2E2;
    color: #991B1B;
    border-color: #FECACA;
}

/* Rose */
.tag-red-4a {
    background-color: #FFE4E6;
    color: #BE123C;
    border-color: #FECDD3;
}

/* ========== SARİ TONLARI ========== */

/* Lemon Yellow */
.tag-yellow-1a {
    background-color: #FEF3C7;
    color: #92400E;
    border-color: #FDE68A;
}

/* Pale Yellow */
.tag-yellow-2a {
    background-color: #FEF9C3;
    color: #713F12;
    border-color: #FEF08A;
}

/* Lemon */
.tag-yellow-3a {
    background-color: #FEF08A;
    color: #713F12;
    border-color: #FDE047;
}

/* Canary */
.tag-yellow-4a {
    background-color: #FDE047;
    color: #713F12;
    border-color: #FACC15;
}

/* Sarı */
.tag-yellow-5a {
    background-color: #FFF9C4;
    color: #F57F17;
    border-color: #FFF59D;
}

/* ========== AMBER TONLARI ========== */

/* Amber */
.tag-amber-1a {
    background-color: #FDE68A;
    color: #78350F;
    border-color: #FCD34D;
}

/* Hardal */
.tag-amber-2a {
    background-color: #FEF3C7;
    color: #854D0E;
    border-color: #FDE68A;
}

/* Altın */
.tag-amber-3a {
    background-color: #FFF8E1;
    color: #B8860B;
    border-color: #FFE082;
}

/* Altın (Alternatif) */
.tag-amber-4a {
    background-color: #FDE68A;
    color: #78350F;
    border-color: #FCD34D;
}

/* Limon */
.tag-amber-5a {
    background-color: #FEF3C7;
    color: #92400E;
    border-color: #FDE68A;
}

/* Amber (Alternatif) */
.tag-amber-6a {
    background-color: #FEF3C7;
    color: #92400E;
    border-color: #FDE68A;
}

/* Butter */
.tag-amber-7a {
    background-color: #FEF3C7;
    color: #854D0E;
    border-color: #FDE68A;
}

/* ========== TURUNCU TONLARI ========== */

/* Tangerine */
.tag-orange-1a {
    background-color: #FFEDD5;
    color: #9A3412;
    border-color: #FED7AA;
}

/* Apricot */
.tag-orange-2a {
    background-color: #FFEDD5;
    color: #7C2D12;
    border-color: #FED7AA;
}

/* Turuncu */
.tag-orange-3a {
    background-color: #FFEDD5;
    color: #9A3412;
    border-color: #FED7AA;
}

/* ========== MERCAN TONLARI ========== */

/* Coral */
.tag-coral-1a {
    background-color: #FED7AA;
    color: #C2410C;
    border-color: #FDBA74;
}

/* Honey */
.tag-coral-2a {
    background-color: #FED7AA;
    color: #7C2D12;
    border-color: #FDBA74;
}

/* Coral (Alternatif) */
.tag-coral-3a {
    background-color: #FED7AA;
    color: #9A3412;
    border-color: #FDBA74;
}

/* Peach */
.tag-coral-4a {
    background-color: #FED7AA;
    color: #7C2D12;
    border-color: #FDBA74;
}

/* Mercan */
.tag-coral-5a {
    background-color: #FED7AA;
    color: #C2410C;
    border-color: #FDBA74;
}

/* ========== MAUVE TONLARI ========== */

/* Mauve */
.tag-mauve-1a {
    background-color: #FAE8FF;
    color: #A21CAF;
    border-color: #F0ABFC;
}

/* Mauve (Alternatif) */
.tag-mauve-2a {
    background-color: #F5D0FE;
    color: #86198F;
    border-color: #F0ABFC;
}

/* Plum */
.tag-mauve-3a {
    background-color: #F5D0FE;
    color: #701A75;
    border-color: #F0ABFC;
}

/* Fuşya */
.tag-mauve-4a {
    background-color: #FAE8FF;
    color: #86198F;
    border-color: #F0ABFC;
}

/* ========== KREMA TONLARI ========== */

/* Krem */
.tag-cream-1a {
    background-color: #FFF8E1;
    color: #E65100;
    border-color: #FFECB3;
}