html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

@media (min-width: 1450px) {
    .container {
        max-width: 1410px !important;
    }
}

@media (min-width: 768px) {
    .mt-md-30 {
        margin-top: -30px !important;
    }

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


.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
}

a {
    text-decoration: none;
}

.footer {
    white-space: normal !important;
    line-height: 30px !important;
    position: relative !important;
}

@keyframes icon-move {
    0%, 100% {
        right: 0;
    }

    85% {
        right: -10px;
    }
}

@keyframes flash {
    0%, 50%, 100% {
        opacity: 1;
    }

    25%, 75% {
        opacity: 0;
    }
}

.flash {
    animation-name: flash;
    animation-duration: 1s;
}

/* Start override full light box image for book*/
.custom-lightBox-image {
    width: 100%;
    height: 100%;
    background-color: #2a25254f;
    display: flex;
    justify-content: center;
    align-items: center;
    transition-duration: 0.3s;
    opacity: 0;
}

    .custom-lightBox-image svg {
        color: white;
        width: 30px;
        height: 30px;
    }

a.overlay:hover .custom-lightBox-image {
    opacity: 1;
}

@media (max-width: 576px) {
    .image-book-details {
        position: relative;
        left: calc(50% - 75px);
    }
}
/* End override full light box image for book*/
/*Publisers Portal*/
.publishers-portal-header li {
    cursor: pointer;
}
/*Start Override BootBox*/
.bootbox-close-button {
    position: absolute;
    top: 0;
    right: 0;
    padding: 0.5rem 0.75rem;
    background-color: transparent;
    border: 0;
    -webkit-appearance: none;
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1;
    color: var(--kt-modal-color);
    text-shadow: none;
    opacity: 0.5;
}

    .bootbox-close-button:hover {
        text-decoration: none;
        opacity: 0.75;
    }

.bootbox-accept:focus {
    box-shadow: none !important;
}
/*End Override BootBox*/
.swal2-container {
    z-index: 9999999999999999999999999;
}

.publishers-portal-header {
    position: relative;
    left: unset !important;
    margin: auto;
}

@media (min-width: 1300px) {
    .publishers-portal-header {
        position: fixed;
        left: 5% !important;
    }
}



.form-floating > .form-control-plaintext ~ label::after, .form-floating > .form-control:focus ~ label::after, .form-floating > .form-control:not(:placeholder-shown) ~ label::after, .form-floating > .form-select ~ label::after {
    background-color: transparent;
}

.navbar .nav-item .nav-link {
    padding-left: 16px !important;
    padding-right: 16px !important;
}

.style-line {
    height: 2px;
    background-color: #782121;
    margin-top: 10px;
}

#navbar_top {
    padding-top: 0; /* إزالة أي مسافة فوق */
    padding-bottom: 0; /* إزالة أي مسافة أسفل */
}

.navbar {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.navbar-nav {
    margin-top: 0;
    margin-bottom: 0;
}

.nav-item img {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    display: inline-block;
}


.nav-item {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    display: flex;
    align-items: center;
}

    .nav-item img {
        max-height: 50px;
        max-width: 50px;
        margin-right: 5px;
    }


.nav-link {
    padding-top: 0;
    padding-bottom: 0;
}

.style-red-circle {
    background-color: #782121;
    border-radius: 50%;
    padding: 20px;
    display: inline-block;
    width: 100px;
    height: 100px;
    overflow: hidden;
    position: relative;
    top: 20px;
}


    .style-red-circle img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        width: 60px;
        height: auto;
    }

.navHeader li {
    white-space: nowrap;
}

.navbar-collapse {
    flex-wrap: nowrap;
}

.navHeader {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.navbar-nav {
    display: flex;
    justify-content: space-evenly;
}

.btn-glow {
    color: #fff;
    background-color: #28a745;
    border: none;
    font-weight: bold;
    padding: 12px 24px;
    font-size: 18px;
    border-radius: 8px;
    box-shadow: 0 0 15px rgba(40, 255, 100, 0.75);
    transition: all 0.3s ease-in-out;
    animation: pulse 1.8s infinite;
}

    .btn-glow:hover {
        background-color: #1f9238;
        box-shadow: 0 0 25px rgba(40, 255, 100, 1);
        transform: scale(1.07);
    }

@keyframes pulse {
    0% {
        box-shadow: 0 0 15px rgba(40, 255, 100, 0.75);
    }

    50% {
        box-shadow: 0 0 25px rgba(40, 255, 100, 1);
    }

    100% {
        box-shadow: 0 0 15px rgba(40, 255, 100, 0.75);
    }
}

.nav-item img {
    margin-left: unset;
    margin-right: -6px;
}
/* =========================
   Announcement Popup v2
   Professional / Responsive
   ========================= */

:root {
    --ann-red: #8B1A35;
    --ann-red-light: #B02245;
    --ann-red-dark: #5C0F22;
    --ann-gold: #D2B27B;
    --ann-gold-soft: rgba(210, 178, 123, 0.18);
    --ann-bg: #F8F3ED;
    --ann-surface: rgba(255, 255, 255, 0.90);
    --ann-surface-2: #FFFDFC;
    --ann-text: #241217;
    --ann-muted: #75666D;
    --ann-radius: 24px;
    --ann-radius-sm: 16px;
    --ann-border: 1px solid rgba(210, 178, 123, 0.22);
    --ann-shadow: 0 30px 80px rgba(37, 8, 18, 0.34), 0 10px 30px rgba(0, 0, 0, 0.14);
    --ann-transition: .38s cubic-bezier(.2,.8,.2,1);
    --ann-header-h: 68px;
    --ann-footer-h: 110px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

/* منع scroll للجسم وقت ظهور البوب أب */
body.ann-lock {
    overflow: hidden;
    touch-action: none;
}

/* ---------- Overlay ---------- */
.ann-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: grid;
    place-items: center;
    padding: 18px;
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--ann-transition), visibility var(--ann-transition);
}

    .ann-overlay.visible {
        opacity: 1;
        visibility: visible;
    }

.ann-backdrop {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at top, rgba(176,34,69,.10), transparent 35%), rgba(10, 3, 6, .72);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* ---------- Modal ---------- */
.ann-modal {
    position: relative;
    width: min(92vw, 920px);
    max-height: min(92vh, 980px);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,243,237,.96));
    border: var(--ann-border);
    border-radius: var(--ann-radius);
    box-shadow: var(--ann-shadow);
    overflow: hidden;
    transform: translateY(28px) scale(.975);
    transition: transform var(--ann-transition);
    isolation: isolate;
}

.ann-overlay.visible .ann-modal {
    transform: translateY(0) scale(1);
}

/* لمعة خفيفة فخمة */
.ann-modal::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at top right, rgba(210,178,123,.18), transparent 28%), radial-gradient(circle at top left, rgba(176,34,69,.10), transparent 26%);
    pointer-events: none;
    z-index: 0;
}

/* ---------- Decorative Corners ---------- */
.ann-corner {
    position: absolute;
    width: 22px;
    height: 22px;
    z-index: 3;
    pointer-events: none;
}

    .ann-corner::before,
    .ann-corner::after {
        content: '';
        position: absolute;
        background: var(--ann-gold);
        opacity: .95;
    }

    .ann-corner::before {
        width: 100%;
        height: 2px;
    }

    .ann-corner::after {
        width: 2px;
        height: 100%;
    }

.ann-corner--tl {
    top: 10px;
    left: 10px;
}

.ann-corner--tr {
    top: 10px;
    right: 10px;
}

.ann-corner--bl {
    bottom: 10px;
    left: 10px;
}

.ann-corner--br {
    bottom: 10px;
    right: 10px;
}

.ann-corner--tl::before,
.ann-corner--tr::before {
    top: 0;
}

.ann-corner--bl::before,
.ann-corner--br::before {
    bottom: 0;
}

.ann-corner--tl::after,
.ann-corner--bl::after {
    left: 0;
    top: 0;
}

.ann-corner--tr::after,
.ann-corner--br::after {
    right: 0;
    top: 0;
}

/* ---------- Header ---------- */
.ann-header {
    position: relative;
    z-index: 2;
    min-height: var(--ann-header-h);
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 58px 16px 18px;
    background: linear-gradient(135deg, var(--ann-red-dark) 0%, var(--ann-red) 100%);
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.ann-header-line {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--ann-gold), transparent);
    opacity: .75;
}

.ann-label {
    color: var(--ann-gold);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .08em;
    white-space: nowrap;
    text-transform: uppercase;
}

.ann-close {
    position: absolute;
    inset-inline-end: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 34px;
    height: 34px;
    border: 1px solid rgba(210,178,123,.35);
    border-radius: 50%;
    background: rgba(255,255,255,.04);
    color: var(--ann-gold);
    cursor: pointer;
    display: grid;
    place-items: center;
    padding: 0;
    transition: background .2s ease, color .2s ease, transform .2s ease, border-color .2s ease;
}

    .ann-close:hover {
        background: var(--ann-gold);
        color: var(--ann-red-dark);
        border-color: var(--ann-gold);
        transform: translateY(-50%) rotate(90deg);
    }

    .ann-close svg {
        width: 14px;
        height: 14px;
    }

/* ---------- Slides Area ---------- */
.ann-slides-wrapper {
    position: relative;
    z-index: 1;
    min-height: 0;
    direction: ltr;
    overflow: hidden;
    padding: clamp(10px, 1.4vw, 16px);
    background: linear-gradient(180deg, #FCF8F3 0%, #F4ECE3 100%);
}

.ann-slides {
    display: flex;
    height: 100%;
    direction: ltr;
    transition: transform .55s cubic-bezier(.22,.61,.36,1);
    will-change: transform;
}

.ann-slide {
    min-width: 100%;
    flex: 0 0 100%;
    display: grid;
    place-items: center;
}

/* ---------- Image Wrapper ---------- */
.ann-img-wrap {
    width: 100%;
    min-height: clamp(320px, 62vh, 760px);
    display: grid;
    place-items: center;
    padding: clamp(8px, 1vw, 14px);
    border-radius: 20px;
    overflow: hidden;
    background: radial-gradient(circle at top, rgba(255,255,255,.98), rgba(247,240,231,.98));
    box-shadow: inset 0 0 0 1px rgba(139,26,53,.06), 0 14px 40px rgba(92,15,34,.08);
}

/* لو الصورة طولية: صغر مساحة عرضها عشان مايبانش فراغ كبير */
.ann-slide.is-portrait .ann-img-wrap {
    max-width: min(92vw, 620px);
    margin-inline: auto;
}

/* لو الصورة عرضية: خذ المساحة كاملة */
.ann-slide.is-landscape .ann-img-wrap {
    max-width: 100%;
}

/* ---------- Image ---------- */
.ann-img {
    display: block;
    max-width: 100%;
    max-height: min(70vh, 780px);
    width: auto;
    height: auto;
    object-fit: contain;
    object-position: center;
    border-radius: 16px;
    transition: transform .45s ease, filter .35s ease;
    filter: saturate(1.02) contrast(1.01);
    cursor: zoom-in;
}

/* للصورة العرضية */
.ann-slide.is-landscape .ann-img {
    width: 100%;
    height: auto;
}

/* للصورة الطولية */
.ann-slide.is-portrait .ann-img {
    width: auto;
    max-width: 100%;
}

.ann-overlay.visible .ann-slide.active .ann-img {
    transform: scale(1.015);
}

@media (hover:hover) {
    .ann-img:hover {
        transform: scale(1.03);
    }
}

/* Placeholder */
.ann-img-placeholder {
    width: 100%;
    min-height: clamp(320px, 60vh, 700px);
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: linear-gradient(135deg, #f7eaee, #efe1e6);
}

    .ann-img-placeholder svg {
        width: 82px;
    }

/* ---------- Footer ---------- */
.ann-footer {
    position: relative;
    z-index: 2;
    min-height: var(--ann-footer-h);
    padding: 14px 18px 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,252,249,.98));
    border-top: 1px solid rgba(139,26,53,.08);
}

/* Dots */
.ann-dots {
    display: flex;
    gap: 7px;
    align-items: center;
}

.ann-dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    border: none;
    background: #D9CED2;
    cursor: pointer;
    padding: 0;
    transition: all .28s ease;
}

    .ann-dot.active {
        width: 24px;
        background: linear-gradient(90deg, var(--ann-red), var(--ann-red-light));
        box-shadow: 0 2px 10px rgba(139,26,53,.28);
    }

/* Arrows */
.ann-arrows {
    display: flex;
    align-items: center;
    gap: 14px;
}

.ann-arrow {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1.5px solid rgba(139,26,53,.85);
    background: #fff;
    color: var(--ann-red);
    cursor: pointer;
    display: grid;
    place-items: center;
    padding: 0;
    transition: all .2s ease;
    box-shadow: 0 6px 16px rgba(92,15,34,.08);
}

    .ann-arrow:hover {
        background: var(--ann-red);
        color: #fff;
        transform: translateY(-1px) scale(1.04);
        box-shadow: 0 10px 24px rgba(92,15,34,.18);
    }

    .ann-arrow svg {
        width: 16px;
        height: 16px;
    }

.ann-counter {
    font-size: 14px;
    color: var(--ann-muted);
    min-width: 54px;
    text-align: center;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

/* زر "لا تظهر مرة أخرى" */
.ann-btn-dismiss {
    background: none;
    border: none;
    color: var(--ann-muted);
    font-size: 12.5px;
    cursor: pointer;
    position: relative;
    padding: 2px 0 4px;
    transition: color .2s ease;
}

    .ann-btn-dismiss:hover {
        color: var(--ann-red);
    }

.ann-btn-line {
    display: block;
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 1px;
    background: var(--ann-red);
    transform: translateX(-50%);
    transition: width .3s ease;
}

.ann-btn-dismiss:hover .ann-btn-line {
    width: 100%;
}

/* ---------- Optional fancy progress line ---------- */
.ann-footer::before {
    content: "";
    width: 46px;
    height: 6px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--ann-red), var(--ann-red-light));
    opacity: .12;
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
}

/* ---------- Responsive ---------- */

/* تابلت */
@media (max-width: 992px) {
    .ann-modal {
        width: min(94vw, 760px);
    }

    .ann-img-wrap {
        min-height: clamp(280px, 56vh, 640px);
    }
}

/* موبايل كبير */
@media (max-width: 768px) {
    .ann-overlay {
        padding: 12px;
        align-items: end;
    }

    .ann-modal {
        width: 100%;
        max-height: 92vh;
        border-radius: 22px 22px 18px 18px;
    }

    .ann-header {
        padding: 16px 54px 14px 16px;
    }

    .ann-label {
        font-size: 12px;
        letter-spacing: .06em;
    }

    .ann-slides-wrapper {
        padding: 10px;
    }

    .ann-img-wrap {
        min-height: clamp(240px, 50vh, 540px);
        border-radius: 16px;
    }

    .ann-img {
        max-height: 58vh;
        border-radius: 12px;
    }

    .ann-footer {
        padding: 12px 14px 16px;
        gap: 10px;
    }

    .ann-arrows {
        gap: 12px;
    }

    .ann-arrow {
        width: 36px;
        height: 36px;
    }
}

/* موبايل صغير */
@media (max-width: 480px) {
    .ann-overlay {
        padding: 0;
    }

    .ann-modal {
        width: 100%;
        max-height: 100vh;
        border-radius: 18px 18px 0 0;
    }

    .ann-header {
        min-height: 60px;
        padding: 14px 50px 12px 14px;
    }

    .ann-close {
        width: 32px;
        height: 32px;
        inset-inline-end: 10px;
    }

    .ann-slides-wrapper {
        padding: 8px;
    }

    .ann-img-wrap {
        min-height: clamp(220px, 46vh, 480px);
        padding: 6px;
        border-radius: 14px;
    }

    .ann-img {
        max-height: 50vh;
        border-radius: 10px;
    }

    .ann-footer {
        min-height: auto;
        padding: 10px 12px 14px;
    }

    .ann-counter {
        font-size: 13px;
    }

    .ann-btn-dismiss {
        font-size: 12px;
    }
}

/* شاشات كبيرة جداً */
@media (min-width: 1440px) {
    .ann-modal {
        width: min(86vw, 980px);
    }
}

/* تقليل الحركة للمستخدمين اللي مفضلين ذلك */
@media (prefers-reduced-motion: reduce) {
    .ann-overlay,
    .ann-modal,
    .ann-slides,
    .ann-img,
    .ann-dot,
    .ann-arrow,
    .ann-close {
        transition: none !important;
        animation: none !important;
    }
}