/*
Theme Name: Raveen child
Theme URI: https://landing.rivaxstudio.com/raveen/
Author: RivaxStudio
Author URI: https://themeforest.net/user/rivaxstudio/
Description: Personal & lightweight wordpress theme
Version: 1.0.1
Template:  raveen
License: Themeforest.net
License URI: http://themeforest.net/licenses
Text Domain: raveen
Tags: personal, lifestyle, blog, magazine, minimal, lightweight, AMP, Dark Mode
*/
/* Mobile navigation for the Raveen default header. */
.raveen-logo-mobile {
    display: none;
}

@media (max-width: 767px) {
    .header-default-bottom {
        position: relative;
        z-index: 20;
        padding: 16px 0;
    }

    .header-default #site-logo {
        display: block;
        max-width: 100%;
        overflow: hidden;
        color: #20263a;
        font-size: 1.45rem;
        font-weight: 600;
        line-height: 1.3;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .raveen-logo-desktop {
        display: none;
    }

    .raveen-logo-mobile {
        display: inline;
    }

    .raveen-mobile-menu {
        position: relative;
    }

    .raveen-mobile-menu > summary {
        display: flex;
        align-items: center;
        gap: 6px;
        min-height: 44px;
        padding: 6px 4px;
        color: #20263a;
        font-size: 14px;
        font-weight: 600;
        list-style: none;
        cursor: pointer;
    }

    .raveen-mobile-menu > summary::-webkit-details-marker {
        display: none;
    }

    .raveen-mobile-menu-icon {
        font-size: 23px;
        line-height: 1;
    }

    .raveen-mobile-menu-panel {
        position: absolute;
        top: calc(100% + 12px);
        right: 0;
        z-index: 100;
        width: min(320px, calc(100vw - 32px));
        padding: 10px 0;
        background: #fff;
        border: 1px solid #e4e8ec;
        border-radius: 6px;
        box-shadow: 0 14px 34px rgb(25 31 44 / 16%);
    }

    .raveen-mobile-menu-list,
    .raveen-mobile-menu-list .sub-menu {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .raveen-mobile-menu-list a {
        display: block;
        padding: 12px 20px;
        color: #20263a;
        font-size: 16px;
        font-weight: 500;
        line-height: 1.4;
        text-decoration: none;
        word-break: keep-all;
    }

    .raveen-mobile-menu-list a:hover,
    .raveen-mobile-menu-list a:focus-visible {
        background: #f3f5fa;
        color: #466dd6;
    }

    .raveen-mobile-menu-list .sub-menu a {
        padding-left: 36px;
    }
}