/* =========================================================
    ASH KT THEME — BUTTON SYSTEM
    All Website Buttons
    ========================================================= */


/* =========================================================
    1. HEADER CONTROL BUTTONS
    Night Mode / Menu / Search Toggle
    ========================================================= */

.ashkt-night-toggle,
.ashkt-menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;

    min-width: 42px;
    min-height: 42px;

    padding: 0;

    border: 1px solid var(--ashkt-border);
    border-radius: 18%;

    background: var(--ashkt-white);
    color: var(--ashkt-heading);

    font-size: 1.15rem;
    cursor: pointer;

    transition:
        background-color 0.3s ease,
        color 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease;
}


/* Search Toggle - Separated & Pure Round Shape */

.ashkt-search-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;

    min-width: 42px;
    min-height: 42px;

    padding: 0;

    border: 1px solid var(--ashkt-border);
    border-radius: 50%;

    background: var(--ashkt-white);
    color: var(--ashkt-heading);

    font-size: 1.15rem;
    cursor: pointer;

    transition:
        background-color 0.3s ease,
        color 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease;
}


/* Header Control Hover */

.ashkt-night-toggle:hover,
.ashkt-menu-toggle:hover,
.ashkt-search-toggle:hover {
    background: var(--ashkt-primary);
    border-color: var(--ashkt-primary);
    color: var(--ashkt-white);

    transform: translateY(-2px);
}


/* =========================================================
    2. MENU CLOSE BUTTON
    ========================================================= */

.ashkt-menu-close {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;

    margin-left: auto;
    margin-bottom: 30px;

    border: 1px solid var(--ashkt-border);
    border-radius: 50%;

    background: var(--ashkt-white);
    color: var(--ashkt-heading);

    font-size: 1.5rem;
    cursor: pointer;
}


/* =========================================================
    3. SEARCH SUBMIT BUTTON
    ========================================================= */

.ashkt-search-box form > button {
    width: 42px;
    height: 42px;

    flex: 0 0 42px;

    padding: 0;

    border: 1px solid var(--ashkt-primary);
    border-radius: 0;

    background: var(--ashkt-primary);
    color: var(--ashkt-white);

    cursor: pointer;

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


/* Search Submit Hover */

.ashkt-search-box form > button:hover {
    background: var(--ashkt-gold);
    border-color: var(--ashkt-gold);
    color: var(--ashkt-white);
}


/* Search Submit Icon */

.ashkt-search-submit-icon {
    font-size: 18px;
    line-height: 1;
}


/* =========================================================
    4. READ MORE BUTTON
    ========================================================= */

.ashkt-read-more-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    height: 38px;

    padding: 0 38px;

    border: 1px solid var(--ashkt-primary);
    border-radius: 999px;

    background: var(--ashkt-primary);
    color: var(--ashkt-white);

    font-size: 0.9rem;
    font-weight: 700;

    text-decoration: none;
    white-space: nowrap;

    transition:
        background-color 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


/* Read More Hover */

.ashkt-read-more-btn:hover {
    background: var(--ashkt-gold);
    border-color: var(--ashkt-gold);
    color: var(--ashkt-white);

    transform: translateY(-2px);

    box-shadow: 0 8px 20px rgba(184, 115, 51, 0.25);
}


/* =========================================================
    5. SMALL MOBILE BUTTON SIZE
    ========================================================= */

@media (max-width: 480px) {

    .ashkt-night-toggle,
    .ashkt-menu-toggle,
    .ashkt-search-toggle {
        width: 38px;
        height: 38px;

        min-width: 38px;
        min-height: 38px;

        font-size: 1rem;
    }

}