/*----------------------------------------*/
/*  Accordion Page Styles
/*----------------------------------------*/

/* Section titles & descriptions */
.nk-section-title {
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 4px;
}
.nk-section-desc {
    color: #6b7a8d;
    font-size: 12px;
    margin-bottom: 16px;
}
.nk-section-desc code {
    color: #03a9f4;
    background: rgba(3, 169, 244, 0.1);
    padding: 1px 5px;
    border-radius: 3px;
    font-size: 11px;
}

/* Base accordion (all variants) */
.nk-accordion .accordion-item {
    background: transparent;
    border: 1px solid #1e3154;
    border-radius: 0;
}
.nk-accordion .accordion-item:first-child {
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}
.nk-accordion .accordion-item:last-child {
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}
.nk-accordion .accordion-item + .accordion-item {
    border-top: 0;
}
.nk-accordion .accordion-button {
    background: #1e3154;
    color: #fff;
    font-size: 13px;
    font-weight: 400;
    padding: 12px 16px;
    box-shadow: none;
    border-radius: 0;
}
.nk-accordion .accordion-item:first-child .accordion-button {
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}
.nk-accordion .accordion-item:last-child .accordion-button.collapsed {
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}
.nk-accordion .accordion-button:not(.collapsed) {
    background: #253a5c;
    color: #fff;
    box-shadow: none;
}
.nk-accordion .accordion-button:focus {
    box-shadow: none;
    border-color: #1e3154;
}
.nk-accordion .accordion-button::after {
    filter: brightness(0) invert(0.6);
}
.nk-accordion .accordion-button:not(.collapsed)::after {
    filter: brightness(0) invert(0.85);
}
.nk-accordion .accordion-body {
    background: #152036;
    color: #8e8e8e;
    font-size: 13px;
    line-height: 1.7;
    padding: 16px;
    border-top: 1px solid #1e3154;
}

/* Flush variant (borderless) */
.nk-accordion-flush .accordion-item {
    border: none;
    border-bottom: 1px solid #1e3154;
    border-radius: 0 !important;
}
.nk-accordion-flush .accordion-item:last-child {
    border-bottom: none;
}
.nk-accordion-flush .accordion-button {
    background: transparent;
    padding: 14px 8px;
    border-radius: 0 !important;
}
.nk-accordion-flush .accordion-button:not(.collapsed) {
    background: transparent;
}
.nk-accordion-flush .accordion-body {
    background: transparent;
    border-top: none;
    padding: 4px 8px 16px;
}

/* Icon accordion — badges align right */
.nk-icon-accordion .accordion-button {
    display: flex;
    align-items: center;
}

/* Bordered accordion — left color stripe */
.nk-bordered-accordion .accordion-item.nk-border-success {
    border-left: 3px solid #198754;
}
.nk-bordered-accordion .accordion-item.nk-border-warning {
    border-left: 3px solid #ffc107;
}
.nk-bordered-accordion .accordion-item.nk-border-danger {
    border-left: 3px solid #dc3545;
}
.nk-bordered-accordion .accordion-item.nk-border-info {
    border-left: 3px solid #0dcaf0;
}
.nk-bordered-accordion .accordion-button small {
    font-size: 11px;
}

/* Nested accordion — inner level styling */
.nk-nested-inner .accordion-button {
    background: transparent;
    font-size: 12px;
    padding: 10px 16px;
    color: #ccc;
    border-radius: 0 !important;
}
.nk-nested-inner .accordion-button:not(.collapsed) {
    background: transparent;
    color: #03a9f4;
}
.nk-nested-inner .accordion-item {
    border: none;
    border-bottom: 1px solid rgba(30, 49, 84, 0.6);
    border-radius: 0 !important;
}
.nk-nested-inner .accordion-item:last-child {
    border-bottom: none;
}
.nk-nested-inner .accordion-body {
    background: transparent;
    border-top: none;
    padding: 4px 16px 14px;
    font-size: 12px;
}
.nk-nested-inner .accordion-body code {
    color: #03a9f4;
    background: rgba(3, 169, 244, 0.1);
    padding: 1px 5px;
    border-radius: 3px;
    font-size: 11px;
}

/* Dark form inputs inside accordions */
.nk-accordion .form-control,
.nk-accordion .form-select {
    background: #1e3154;
    border-color: #253a5c;
    color: #fff;
    font-size: 13px;
}
.nk-accordion .form-control:focus,
.nk-accordion .form-select:focus {
    background: #1e3154;
    border-color: #03a9f4;
    color: #fff;
    box-shadow: 0 0 0 2px rgba(3, 169, 244, 0.15);
}
.nk-accordion .form-label {
    color: #8e8e8e;
    font-size: 12px;
    margin-bottom: 4px;
}
.nk-accordion textarea.form-control {
    height: auto;
    min-height: 60px;
}

/* Color dots for Appearance section */
.nk-color-dot {
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    cursor: pointer;
    border: 2px solid transparent;
    transition: border-color 0.2s;
}
.nk-color-dot:hover {
    border-color: rgba(255, 255, 255, 0.4);
}
