/* Meniu Mobil Daru - refacut complet de Costin Manea, 2026.
   Culorile meniului se schimba doar din variabilele de mai jos. */
.rm-header,
.rm-overlay,
.rm-pannel {
    --rm-accent: #ec4815;
    --rm-header-line: #eb4816;
    --rm-bg: #000;
    --rm-sub-bg: #131313;
    --rm-line: #222;
    --rm-text: #fff;
    --rm-muted: #9a9a9a;
    --rm-press-bg: #fff;
    --rm-press-text: #ec4815;
    --rm-badge: #e0201b;
    --rm-speed: .26s;
}

/* ------------------------------------------------ pagina, pe mobil */
@media only screen and (max-width: 767px) {
    #block_top_menu,
    .rm-body-with-header #header_logo,
    .rm-body-with-header .header-nav,
    .rm-display-search #search_block_top,
    .rm-display-search #search_widget {
        display: none;
    }

    /* theme.css pune body, html { height: 100% }, ceea ce opreste sticky dupa un ecran. */
    html,
    body.rm-body-with-header {
        height: auto !important;
        min-height: 100%;
    }
}

@media only screen and (min-width: 768px) {
    body.rm-body-with-header {
        padding-top: 0;
    }
    .rm-header {
        display: none;
    }
}

/* ------------------------------------------------ bara de sus */
.rm-header {
    position: sticky;
    top: 0;
    left: 0;
    height: 60px;
    width: 100%;
    background: var(--rm-bg);
    border-bottom: 1px solid var(--rm-header-line);
    z-index: 10000;
}

.rm-header .logo {
    height: 45px;
    margin: 5px;
    position: absolute;
    left: 70px;
}

.rm-header .search {
    font-family: FontAwesome;
    display: block;
    position: absolute;
    right: 20px;
    font-size: 30px;
    color: #fff;
    margin: 10px;
    line-height: 17px;
    margin-right: 30px;
    padding: 12px 10px;
}

.rm-searchbar {
    color: #777;
    font-size: 0;
    border-bottom: 1px solid var(--rm-header-line);
    height: 37px;
    overflow: hidden;
    position: absolute;
    top: 60px;
    width: 100%;
    transition: height .3s;
}

.rm-searchbar .searchquery {
    width: 80%;
    line-height: 39px;
    padding: 0 0 0 5px;
    font-size: 14px;
    border: none;
}

.rm-searchbar .searchbutton {
    font-family: FontAwesome;
    width: 20%;
    background-color: #333;
    color: #777;
    line-height: 36px;
    font-size: 24px;
    border: none;
    position: absolute;
    padding: 0;
}

.rm-searchbar.closed {
    height: 0;
}

@media (max-width: 320px) {
    .rm-header .logo {
        height: 35px;
        top: 10px;
    }
}

/* butonul de meniu */
.meniux {
    display: inline-block;
    cursor: pointer;
    padding: 10px;
    -webkit-tap-highlight-color: transparent;
}

.bar1,
.bar2,
.bar3 {
    width: 35px;
    height: 4px;
    background-color: #fff;
    margin: 6px 0;
    transition: .4s;
    color: #fff;
}

.bar3::after {
    content: "MENIU";
    font-size: 10px;
    font-weight: bold;
    font-family: sans-serif;
}

.schimbarex .bar1 {
    transform: rotate(-45deg);
    width: 28px;
}

.schimbarex .bar2 {
    opacity: 0;
}

.schimbarex .bar3 {
    transform: rotate(45deg);
    width: 28px;
    margin-top: -3px;
}

/* ------------------------------------------------ fundalul si panoul */
.rm-overlay {
    position: fixed;
    top: 60px;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 10000;
    background: rgba(0, 0, 0, .45);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    transition: opacity var(--rm-speed) ease, visibility var(--rm-speed);
    touch-action: none;
}

.rm-overlay--close {
    opacity: 0;
    visibility: hidden;
}

.rm-overlay--open {
    opacity: 1;
    visibility: visible;
}

.rm-pannel {
    position: fixed;
    top: 60px;
    left: 0;
    z-index: 10000;
    width: 86%;
    max-width: 400px;
    height: calc(100vh - 60px);
    height: calc(100dvh - 60px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    background: var(--rm-bg);
    box-shadow: 8px 0 30px rgba(0, 0, 0, .35);
    transition: transform var(--rm-speed) cubic-bezier(.2, .8, .2, 1), visibility var(--rm-speed);
}

.rm-pannel::-webkit-scrollbar {
    display: none;
}

.rm-pannel--close {
    transform: translateX(-105%);
    visibility: hidden;
}

.rm-pannel--open {
    transform: translateX(0);
    visibility: visible;
}

.rm-container {
    width: 100%;
    padding-bottom: calc(32px + env(safe-area-inset-bottom));
    font-family: 'Roboto Condensed', sans-serif;
}

/* ------------------------------------------------ zona de login */
.rm-pannel .rmm-auth {
    padding: 14px 16px;
    border-bottom: 1px solid var(--rm-line);
    text-align: center;
    color: var(--rm-text);
    box-sizing: border-box;
}

.rm-pannel .rmm-hello {
    margin: 0 0 10px;
    color: var(--rm-text);
    font-size: 15px;
}

.rm-pannel .rmm-auth-actions {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
}

.rm-pannel a.auth-link,
.rm-pannel a.auth-link:hover,
.rm-pannel a.auth-link:focus,
.rm-pannel a.auth-link:active,
.rm-pannel a.auth-link:visited {
    text-decoration: none;
    text-transform: none;
    color: var(--rm-text);
    -webkit-tap-highlight-color: transparent;
}

.rm-pannel a.rmm-auth-login,
.rm-pannel a.rmm-auth-main {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    border-radius: 10px;
    background: var(--rm-accent);
    font-size: 16px;
    font-weight: bold;
}

.rm-pannel a.rmm-auth-main {
    flex: 1 1 auto;
}

.rm-pannel .rmm-auth-new {
    margin: 10px 0 0;
    color: var(--rm-muted);
    font-size: 14px;
    line-height: 1.3;
}

.rm-pannel .rmm-auth-new a.auth-link {
    display: inline-block;
    padding: 4px 2px;
    font-weight: bold;
    font-size: 15px;
}

.rm-pannel a.rmm-auth-logout,
.rm-pannel a.rmm-auth-logout:hover,
.rm-pannel a.rmm-auth-logout:focus,
.rm-pannel a.rmm-auth-logout:active,
.rm-pannel a.rmm-auth-logout:visited {
    flex: 0 0 auto;
    padding: 12px 10px;
    color: var(--rm-muted);
    font-size: 15px;
}

/* ------------------------------------------------ butoanele de sus */
.rm-pannel .rmm-tiles {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: 0;
    padding: 10px 12px;
    list-style: none;
    border-bottom: 1px solid var(--rm-line);
}

.rm-pannel .rmm-tiles .rmm-li:only-child {
    grid-column: 1 / -1;
}

.rm-pannel .rmm-tiles .rmm-row {
    --rmm-bg: #1b1b1b;
    justify-content: center;
    min-height: 44px;
    padding: 0 6px;
    border: 0;
    border-radius: 10px;
    font-size: 15px;
}

.rm-pannel .rmm-minor-title {
    padding: 16px 16px 6px;
    color: var(--rm-muted);
    font-size: 13px;
    font-weight: normal;
}

.rm-pannel .rmm-list--minor .rmm-row {
    min-height: 44px;
    border-bottom: 0;
    font-size: 15px;
    font-weight: normal;
}

/* ------------------------------------------------ arborele */
.rm-pannel .rmm-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.rm-pannel .rmm-li {
    display: block;
    margin: 0;
    padding: 0;
}

/* Starile sunt doar variabile: aceeasi regula acopera :hover, :focus si :active, deci
   a:hover/a:focus din theme.css nu mai pot colora un link cand degetul trece peste el. */
.rm-pannel .rmm-row,
.rm-pannel .rmm-row:hover,
.rm-pannel .rmm-row:focus,
.rm-pannel .rmm-row:active,
.rm-pannel .rmm-row:visited {
    color: var(--rmm-color, var(--rm-text));
    background: var(--rmm-bg, transparent);
    text-decoration: none;
    outline: 0;
}

.rm-pannel .rmm-row {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: 48px;
    margin: 0;
    padding: 0 16px;
    border: 0;
    border-bottom: 1px solid var(--rm-line);
    border-radius: 0;
    box-sizing: border-box;
    font-family: inherit;
    font-size: 16px;
    font-weight: bold;
    line-height: 1.25;
    text-align: left;
    cursor: pointer;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
    -webkit-appearance: none;
    appearance: none;
    transition: background-color .12s, color .12s;
}

.rm-pannel .rmm-toggle {
    --rmm-bg: var(--rm-bg);
}

.rm-pannel .rmm-rowlink,
.rm-pannel .rmm-rowlink:hover,
.rm-pannel .rmm-rowlink:focus,
.rm-pannel .rmm-rowlink:active,
.rm-pannel .rmm-rowlink:visited {
    color: inherit;
    text-decoration: none;
    outline: 0;
}

.rm-pannel .rmm-split {
    padding: 0;
}

.rm-pannel .rmm-rowlink {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    gap: 8px;
    min-width: 0;
    min-height: 47px;
    padding: 0 8px 0 16px;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.rm-pannel .rmm-chevbtn {
    display: flex;
    flex: 0 0 52px;
    align-items: center;
    justify-content: center;
    min-height: 47px;
    margin: 0;
    padding: 0;
    border: 0;
    border-left: 1px solid var(--rm-line);
    border-radius: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    outline: 0;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
    -webkit-appearance: none;
    appearance: none;
}

.rm-pannel .rmm-label {
    min-width: 0;
}

.rm-pannel .rmm-link,
.rm-pannel .rmm-rowlink {
    text-transform: capitalize;
}

.rm-pannel .rmm-ico {
    flex: 0 0 auto;
    font-family: FontAwesome;
    font-size: 15px;
    font-weight: normal;
}

.rm-pannel .rmm-tone-green { color: #59ff00; }
.rm-pannel .rmm-tone-red { color: #ff2b2b; }
.rm-pannel .rmm-tone-orange { color: var(--rm-accent); }

/* iconitele vechi din theme.css ar aparea dublate pe aceleasi ID-uri */
#rm-container a[id^="mobile_"]::before {
    content: none !important;
}

.rm-pannel .rmm-badge {
    flex: 0 0 auto;
    padding: 2px 7px;
    border-radius: 999px;
    background: var(--rm-badge);
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    line-height: 1.3;
    text-transform: none;
}

.rm-pannel .rmm-chev {
    flex: 0 0 auto;
    width: 9px;
    height: 9px;
    margin-left: auto;
    border-right: 2px solid var(--rm-muted);
    border-bottom: 2px solid var(--rm-muted);
    transform: rotate(-45deg);
    transition: transform var(--rm-speed) ease;
}

.rm-pannel .rmm-chevbtn .rmm-chev {
    margin-left: 0;
}

.rm-pannel .rmm-acc.is-open > .rmm-row .rmm-chev {
    transform: rotate(45deg);
}

/* nivelurile de jos: bold ramane pe tot ce are subdiviziuni, ultimele diviziuni sunt normale */
.rm-pannel .rmm-l2 > .rmm-row,
.rm-pannel .rmm-l3 > .rmm-row {
    --rmm-bg: var(--rm-sub-bg);
    min-height: 44px;
    font-size: 15px;
}

.rm-pannel .rmm-l2:not(.rmm-acc) > .rmm-row,
.rm-pannel .rmm-l3:not(.rmm-acc) > .rmm-row {
    font-weight: normal;
}

.rm-pannel .rmm-l2 > .rmm-row {
    padding-left: 30px;
}

.rm-pannel .rmm-l3 > .rmm-row {
    padding-left: 46px;
}

.rm-pannel .rmm-l2 > .rmm-split {
    padding-left: 0;
}

.rm-pannel .rmm-l2 > .rmm-split .rmm-rowlink {
    padding-left: 30px;
}

.rm-pannel .rmm-list--sub {
    position: relative;
}

.rm-pannel .rmm-list--sub::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 17px;
    width: 1px;
    background: #333;
    z-index: 1;
    pointer-events: none;
}

.rm-pannel .rmm-l2 .rmm-list--sub::before {
    left: 33px;
}

/* acordeonul, fara limita fixa de inaltime */
.rm-pannel .rmm-panel {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows var(--rm-speed) ease;
}

.rm-pannel .rmm-acc.is-open > .rmm-panel {
    grid-template-rows: 1fr;
}

.rm-pannel .rmm-panel-in {
    min-height: 0;
    overflow: hidden;
    visibility: hidden;
    transition: visibility var(--rm-speed);
}

.rm-pannel .rmm-acc.is-open > .rmm-panel > .rmm-panel-in {
    visibility: visible;
}

/* ------------------------------------------------ starile */
/* categoria curenta: rand alb, se vede imediat; titlurile care o contin raman portocalii */
.rm-pannel .rmm-acc.has-current > .rmm-row {
    --rmm-color: var(--rm-accent);
}

.rm-pannel .rmm-li.is-current > .rmm-row {
    --rmm-color: var(--rm-accent);
    --rmm-bg: var(--rm-press-bg);
    position: relative;
    z-index: 2;
    font-weight: bold;
    box-shadow: inset 4px 0 0 var(--rm-accent);
}

/* doar pe dispozitive cu mouse */
@media (hover: hover) and (pointer: fine) {
    .rm-pannel .rmm-row:hover {
        --rmm-bg: #1c1c1c;
    }
}

/* apasarea: alb, pusa din JS si anulata la scroll */
.rm-pannel .rmm-row.is-pressed,
.rm-pannel .rmm-li.is-current > .rmm-row.is-pressed,
.rm-pannel .rmm-acc.has-current > .rmm-row.is-pressed {
    --rmm-color: var(--rm-press-text);
    --rmm-bg: var(--rm-press-bg);
    transition: none;
}

/* ------------------------------------------------ incarcare si eroare */
.rm-pannel .rmm-skeleton {
    padding: 16px;
}

.rm-pannel .rmm-skeleton span {
    display: block;
    height: 18px;
    margin: 0 0 22px;
    border-radius: 4px;
    background: #1d1d1d;
}

.rm-pannel .rmm-skeleton span:first-child {
    height: 58px;
}

.rm-pannel .rmm-error {
    padding: 24px 16px;
    color: var(--rm-text);
    text-align: center;
}

.rm-pannel .rmm-retry {
    display: inline-block;
    margin-top: 12px;
    padding: 10px 18px;
    border: 0;
    border-radius: 999px;
    background: var(--rm-accent);
    color: #fff;
    font-weight: bold;
}

@media (prefers-reduced-motion: reduce) {
    .rm-overlay,
    .rm-pannel,
    .rm-pannel .rmm-panel,
    .rm-pannel .rmm-panel-in,
    .rm-pannel .rmm-chev,
    .rm-pannel .rmm-row {
        transition: none;
    }
}
