/* ═══════════════════════════════════════════════════════════════════
   Risevest Limited — Dark & Gold Theme
   Primary bg:     #0d0d0d
   Surface:        #120e08  /  #1a1408  /  #17213d → #1a1408
   Gold:           #C9A96E
   Gold dark:      #b8935a
   Gold subtle:    rgba(201,169,110,0.12)
   Gold border:    rgba(201,169,110,0.25)
   ═══════════════════════════════════════════════════════════════════ */

body, html {
    height: 100%;
    margin: 0px !important;
    padding: 0px !important;
}
body {
    background: #0d0d0d !important;
}

a {
    text-decoration: none !important;
}

.site-container {
    background: #0d0d0d;
    display: table;
    height: inherit;
    width: 100%;
    margin: 0px !important;
    margin-bottom: 0px;
    padding: 0px !important;
}

/* ── Navigation ── */
.navMobileActive  { background: #120e08 !important; }
.navbar-active    { background: #120e08 !important; }
.mobileNavBg      { background-color: #120e08 !important; }

/* ── Backgrounds ── */
.dark-bg   { background: #0d0d0d !important; }
.dark-bg2  { background: #120e08 !important; }
.dark-bg3  { background: #1a1408 !important; }
.dark-input {
    background: #120e08 !important;
    border: 1px solid rgba(201,169,110,0.25) !important;
}
.modal-bg  { background: #120e08 !important; }
.light-bg  { background: rgba(201,169,110,0.08) !important; }
.light-bg2 { background: rgba(201,169,110,0.08) !important; }

.yellow-bg { background: #C9A96E !important; }
.blue-bg   { background: #C9A96E !important; }   /* was #3741d8 → gold */
.green-bg  { background: #10b981 !important; }
.red-bg    { background: #ef4444 !important; }

.hide { display: none !important; }

/* ── Text colours ── */
.textColor   { color: #fff !important; }
.textColor2  { color: rgba(255,255,255,0.85) !important; }
.redText     { color: #ef4444 !important; }
.greenText   { color: #10b981 !important; }
.site-yellow { color: #C9A96E !important; }
.blueText    { color: #C9A96E !important; }   /* repurposed to gold */

p, h1, h2, h3, h4, h5, span, small { color: #fff; }

.messageText { font-size: 16px; }

/* ── Spacing helpers ── */
.p-50  { padding: 50px; }
.px-50 { padding-left: 50px !important; padding-right: 50px !important; }
.align-center { text-align: center; }
.align-right  { text-align: right; }

.greyWhite  { color: rgba(255,255,255,0.85) !important; }
.greyWhite3 { color: rgba(255,255,255,0.85) !important; }
.greyWhite2 { color: rgba(255,255,255,0.55) !important; }
.white-bg   { background: rgba(201,169,110,0.08); }
.white-bg2  { background: rgba(201,169,110,0.08); }

/* ── Form elements ── */
input:focus {
    border-color: #C9A96E !important;
    -webkit-box-shadow: 0 0 0 3px rgba(201,169,110,0.15) !important;
    box-shadow: 0 0 0 3px rgba(201,169,110,0.15) !important;
}
input {
    background: none !important;
    color: #fff !important;
    border-color: rgba(201,169,110,0.25) !important;
    caret-color: #C9A96E;
}

select:focus {
    border-color: #C9A96E !important;
    -webkit-box-shadow: 0 0 0 3px rgba(201,169,110,0.15) !important;
    box-shadow: 0 0 0 3px rgba(201,169,110,0.15) !important;
}
select {
    background: #1a1408 !important;
    color: #fff !important;
    border-color: rgba(201,169,110,0.25) !important;
}

textarea {
    background: none !important;
    color: #fff !important;
}
textarea:focus {
    border-color: #C9A96E !important;
    -webkit-box-shadow: 0 0 0 3px rgba(201,169,110,0.15) !important;
    box-shadow: 0 0 0 3px rgba(201,169,110,0.15) !important;
}

/* ── Margin helpers ── */
.mt-70 { margin-top: 70px; }
.mt-50 { margin-top: 50px; }
.mb-50 { margin-bottom: 50px; }
.mt-30 { margin-top: 30px; }

.material-icons-two-tone { color: #C9A96E !important; }
.roboto { font-family: 'Roboto', sans-serif; }

/* ── Buttons ── */
.Btn {
    background: linear-gradient(135deg, #C9A96E 0%, #b8935a 100%);
    border: none;
    border-radius: 8px;
    text-align: center;
    padding: 12px;
    color: #0d0d0d;
    font-weight: 700;
    width: 100%;
    font-family: 'Source Sans Pro', sans-serif;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(201,169,110,0.3);
}
.Btn:hover { transform: translateY(-2px); box-shadow: 0 8px 25px rgba(201,169,110,0.4); }
.Btn:focus { outline: 0; box-shadow: 0 0 0 3px rgba(201,169,110,0.25); }

.btn-outline {
    background: rgba(201,169,110,0.1);
    border: 1px solid rgba(201,169,110,0.35);
    border-radius: 8px;
    text-align: center;
    padding: 12px;
    color: #C9A96E;
    font-weight: 600;
    width: 100%;
    font-family: 'Source Sans Pro', sans-serif;
    cursor: pointer;
    transition: all 0.3s ease;
}
.btn-outline:hover { background: rgba(201,169,110,0.18); }
.btn-outline:focus { outline: 0; }
.add-btn-border { border: 1px solid #C9A96E; }

.boldText { font-weight: 600; }

.BtnWhite {
    background: none;
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: 8px;
    text-align: center;
    padding: 12px;
    color: #fff;
    width: 100%;
    font-family: 'Source Sans Pro', sans-serif;
    cursor: pointer;
    transition: all 0.3s ease;
}
.BtnWhite:hover { border-color: #C9A96E; color: #C9A96E; }
.BtnWhite:focus { outline: 0; }

.BtnDark {
    background: #1a1408;
    border: 1px solid rgba(201,169,110,0.2);
    border-radius: 8px;
    text-align: center;
    padding: 12px;
    color: rgba(255,255,255,0.85);
    width: 100%;
    font-family: 'Source Sans Pro', sans-serif;
    cursor: pointer;
    transition: all 0.3s ease;
}
.BtnDark:hover { background: rgba(201,169,110,0.1); border-color: rgba(201,169,110,0.35); }
.BtnDark:focus { outline: 0; }

/* ── Text helpers ── */
.blackText  { color: #0d0d0d !important; }
.blackText2 { color: #120e08 !important; }
.blackText3 { color: #0d0d0d !important; }

/* ── Cards / surfaces ── */
.floating-icon-div {
    background: #1a1408;
    padding: 15px;
    border-radius: 12px;
    position: relative;
    z-index: 1;
    margin-top: -80px;
    width: fit-content;
    border: 2px solid rgba(201,169,110,0.25);
    box-shadow: 0 8px 25px rgba(0,0,0,0.4);
}

.fixIcon  { position: relative; top: 2px; }
.fixIcon2 { position: relative; top: 3px; }
.fixIcon3 { position: relative; top: 4px; }
.fixIcon4 { position: relative; top: 5px; }

/* ── Auth / login ── */
.login-bg {
    background-image: url('/static/assets/images/site-image/bg2.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
.caro-bg-overlay { background: rgba(13,13,13,0.93); height: 100%; }

.tabs-wrapper { background: #0d0d0d !important; }

.blankBtn { background: none !important; border: none !important; color: #fff; }

.trans-post-form {
    background: rgba(18,14,8,0.85) !important;
    border: 1px solid rgba(201,169,110,0.15);
    transition: all 0.3s ease;
}
.post-form-border { border: 1px solid rgba(201,169,110,0.25); }

/* ── Spinner (gold) ── */
.lds-dual-ring {
    display: inline-block;
    border-radius: 8px;
    transform: rotate(45deg);
}
.lds-dual-ring:after {
    content: " ";
    display: block;
    width: 30px;
    height: 30px;
    margin: 8px;
    border-radius: 50%;
    border: 3px solid #C9A96E;
    border-color: #C9A96E transparent #C9A96E transparent;
    animation: lds-dual-ring 1.2s linear infinite;
}
@keyframes lds-dual-ring {
    0%   { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* ── Dialog / modal ── */
.dialog {
    position: fixed;
    z-index: 99999;
    left: 0; top: 0;
    width: 100%; height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,0.88);
    backdrop-filter: blur(6px);
}
.dialogContent {
    box-shadow: 0 20px 40px rgba(0,0,0,0.6), 0 0 0 1px rgba(201,169,110,0.15);
    background-color: #120e08;
    padding: 24px;
    width: 90%;
    border-radius: 16px;
    border: 1px solid rgba(201,169,110,0.25);
    margin: 0;
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
}

/* ── Icon pills ── */
.round-icon-trans {
    border-radius: 50%;
    padding: 14px 18px 12px;
    text-align: center;
    background: rgba(201,169,110,0.15);
    color: #C9A96E;
    width: fit-content;
    border: 1px solid rgba(201,169,110,0.25);
}
.round-icon { border-radius: 100px; padding: 14px 18px 12px; }

/* ── Animated success checkmark (gold) ── */
.checkmark__circle {
    stroke-dasharray: 166; stroke-dashoffset: 166;
    stroke-width: 2; stroke-miterlimit: 10;
    stroke: #C9A96E; fill: none;
    animation: stroke 0.6s cubic-bezier(0.65,0,0.45,1) forwards;
}
.checkmark {
    width: 56px; height: 56px; border-radius: 50%; display: block;
    stroke-width: 2; stroke: #C9A96E; stroke-miterlimit: 10;
    margin: 10% auto;
    box-shadow: inset 0px 0px 0px #C9A96E;
    animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
}
.checkmark__check {
    transform-origin: 50% 50%;
    stroke-dasharray: 48; stroke-dashoffset: 48;
    animation: stroke 0.3s cubic-bezier(0.65,0,0.45,1) 0.8s forwards;
}
@keyframes stroke  { 100% { stroke-dashoffset: 0; } }
@keyframes scale   { 0%,100%{transform:none} 50%{transform:scale3d(1.1,1.1,1)} }
@keyframes fill    { 100% { box-shadow: inset 0px 0px 0px 30px transparent; } }

/* ── Sidebar ── */
.sideBar {
    background: #120e08;
    height: 100vh;
    z-index: 999 !important;
    left: 0px;
    overflow: auto;
    padding-top: 10px !important;
    margin: 0px;
    box-shadow: 2px 0 20px rgba(0,0,0,0.5), 1px 0 0 rgba(201,169,110,0.1);
    max-width: 15%;
}

/* ── Borders ── */
.border-t  { border-top:    2px solid rgba(201,169,110,0.15); }
.border-r  { border-right:  1px solid rgba(201,169,110,0.15); }
.border-b  { border-bottom: 1px solid rgba(201,169,110,0.2) !important; }
.border-l2 { border-left:   1px solid rgba(201,169,110,0.2) !important; }
.border-l  { border-left:   1px solid rgba(201,169,110,0.15); }
.my-border  { border: 1px solid rgba(201,169,110,0.3); border-radius: 8px; }
.my-border2 { border: 1px solid rgba(201,169,110,0.2); border-radius: 8px; }

/* ── Sidebar icons ── */
.side-icon {
    background: none;
    color: rgba(255,255,255,0.65);
    padding: 8px 10px;
    border-radius: 8px;
    transition: all 0.3s ease;
}
.side-icon:hover { color: #C9A96E; background: rgba(201,169,110,0.1); }
.side-icon-active { background: none; color: #C9A96E; }

.side_bar_link_active {
    background: rgba(201,169,110,0.1);
    margin-left: 4px;
    padding: 10px 2px;
    border-radius: 8px 0px 0px 8px;
    border-right: 3px solid #C9A96E;
}

/* ── Post / card box ── */
.post-box {
    background: #120e08;
    padding: 12px;
    border-radius: 12px;
    border: 1px solid rgba(201,169,110,0.15);
    transition: all 0.3s ease;
}
.post-box:hover { border-color: rgba(201,169,110,0.3); }

/* ── Progress / stepper ── */
.progress-track ul { text-align: center; }
.progress-track li { display: inline-block; width: 50px; }

/* ── Mobile sidebar ── */
.side-bar-mobile {
    position: fixed;
    left: 0; top: 0;
    width: 75%; height: 100%;
    background: #120e08;
    z-index: 999;
    overflow-y: scroll; overflow-x: hidden;
    box-shadow: 4px 0 20px rgba(0,0,0,0.6);
    border-right: 1px solid rgba(201,169,110,0.15);
}
.overlayDiv {
    position: fixed;
    width: 100%; height: 100%;
    display: none;
    background: rgba(0,0,0,0.6);
    backdrop-filter: blur(3px);
}

/* ── Tab underline ── */
.activeTabLine::after {
    border-bottom: 3px solid #C9A96E;
    content: "";
    display: block;
    margin: 0 auto;
    width: 30%;
    padding-top: 10px;
}

/* ── Payment option states ── */
.pay-option-container-active2 {
    border: 2px solid #C9A96E;
    border-radius: 8px;
    background: rgba(201,169,110,0.08);
}
.pay-option-container-active {
    background: rgba(201,169,110,0.12);
}

/* ── Padding helpers ── */
.pt-50 { padding-top: 50px; }
.pb-50 { padding-bottom: 50px; }
.px-50 { padding-left: 50px; padding-right: 50px; }
.py-50 { padding-top: 50px; padding-bottom: 50px; }

.pointer { cursor: pointer; }

/* ── Active border highlight ── */
.border-active { border: 2px solid #C9A96E; color: #fff !important; }

/* ── Account control panel ── */
.account-control-panel {
    background: #120e08;
    border: 1px solid rgba(201,169,110,0.25) !important;
    border-radius: 16px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.5);
    position: fixed;
    z-index: 999;
    right: 30px; top: 70px;
    width: 300px;
}
.account-control-panel .a-p-inner:hover { background: rgba(201,169,110,0.08); }

.account-control-panel-overlay {
    position: fixed;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 99;
    left: 0; top: 0;
}

.popLabel {
    padding: 10px;
    background: none;
    display: table;
    border-radius: 8px;
    border: 1px solid #C9A96E;
    color: #C9A96E;
}

input[type="file"] { display: none; }

/* ── Index / hero backgrounds ── */
.index-bg-2 {
    background-image: url('/static/assets/images/site-image/bg1.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
.index-bg-2-overlay {
    background: rgba(13,13,13,0.88);
    height: 100%;
}

/* ── Theme-swap overlay ── */
.theme-swap {
    height: 100%; width: 100%;
    position: fixed;
    z-index: 9999999;
    background: #0d0d0d;
    top: 0px;
    display: none;
}

/* ══════════════════════════════════════════
   MEDIA QUERIES
   ══════════════════════════════════════════ */

/* ── Small screens (≤ 768px) ── */
@media only screen and (max-width: 768px) {
    .monstTextSm { font-size: 42px !important; }
    .monstText   { font-size: 32px; }
    .table-responsive-sm { max-width: 90vw !important; }
    .no-border-sm { border: none !important; }
    .no-bg-sm     { background: none; }
    .account-control-panel { right: 10px; }

    .post-form {
        background: #120e08;
        padding: 24px;
        border-radius: 12px;
        border: 1px solid rgba(201,169,110,0.2);
    }

    .card-mt  { margin-top: 40px; }
    .reduceH5 { font-size: 16px; }
    .floating-icon-div { margin-top: -60px; }

    .fix-mtSm  { margin-top: 20px; }
    .fix-mtSm2 { margin-top: 35px; }
    .fix-mtSm3 { margin-top: 100px; }

    .xsmall  { font-size: 15px !important; }
    .xsmall2 { font-size: 13px !important; }
    .xsmall3 { font-size: 10px !important; }

    .align-center-sm { text-align: center; }

    .index-bg {
        background-image: url('/static/assets/images/site-image/index-bg-sm.png');
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
    }
    .index-bg-overlay   { background: rgba(13,13,13,0.65); height: 100%; }
    .index-bg-overlay-2 { background: rgba(13,13,13,0.88); height: 100%; }

    .border-t-sm { border-top: 1px solid rgba(201,169,110,0.2); }
    .index-mt    { margin-top: 25%; }
    .dialogWidth { width: 80% !important; }
}

/* ── Large screens (≥ 768px) ── */
@media only screen and (min-width: 768px) {
    .style-scrollbar::-webkit-scrollbar { background: none; width: 8px; }
    .style-scrollbar::-webkit-scrollbar-track { background: none; width: 5px; }
    .style-scrollbar::-webkit-scrollbar-thumb {
        background: linear-gradient(180deg, #C9A96E, #b8935a);
        border-radius: 4px;
    }

    .post-form {
        background: #120e08;
        padding: 50px;
        border-radius: 16px;
        border: 1px solid rgba(201,169,110,0.2);
        width: 38%;
    }

    .card-mt       { margin-top: 100px; }
    .dialogContent { width: 35%; }
    .fix-mt        { margin-top: 100px; }
    .mml           { margin-left: 30px !important; }
    small          { font-size: 14px !important; }

    .border-l-lg    { border-left:   1px solid rgba(201,169,110,0.15); }
    .dashed-border-lg { border: 1px dashed rgba(201,169,110,0.2); }

    .monstText { font-size: 58px; }
    .index-mt  { margin-top: 150px; }

    .index-bg {
        background-image: url('/static/assets/images/site-image/inner-bg.png');
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
    }
    .index-bg-overlay   { background: rgba(13,13,13,0.88); height: 100%; }
    .index-bg-overlay-2 { background: rgba(13,13,13,0.88); height: 100%; }

    .reduceH5 { font-size: 18px; }
    .cont-lg-100 { padding-left: 100px !important; padding-right: 100px !important; }

    .index-image { position: relative; }

    .floating-post-box-1 {
        position: absolute; top: 200px; left: -50px;
        width: 300px; height: 130px; z-index: 2;
        background: #120e08;
        border: 1px solid rgba(201,169,110,0.25);
        border-radius: 12px;
        box-shadow: 0 8px 25px rgba(0,0,0,0.4);
    }
    .floating-post-box-2 {
        position: absolute; top: 300px; left: 40px;
        width: 300px; height: 200px; z-index: 1;
        background: rgba(18,14,8,0.85);
        border: 1px solid rgba(201,169,110,0.15);
        border-radius: 12px;
    }

    .icon-19 { position: absolute; top: 15px; right: 14px; width: 120px; height: 80px; }
    .icon-21 { position: absolute; top: 10px; left: -50px; }
    .icon-23 { position: absolute; top: 470px; left: -80px; }

    #circlesPath {
        position: absolute;
        background: none;
        width: fit-content;
        z-index: -1;
        left: -70px;
    }
}