/* =========================================================
   Credit Baniya Balanced Premium Theme v1.3
   Cleaned version - higher contrast + customer journey fixes
   ========================================================= */

:root{
  --bg-teal:#E9F0EE;
  --surface-teal:#FFFFFF;
  --border-teal:#B8CDC8;
  --gold-accent:#D28B18;
  --gold-hover:#B9730C;

  /* Important: white stays white for dark surfaces */
  --text-white:#FFFFFF;

  --text-muted:#536661;
  --bg-main:#E9F0EE;
  --card-bg:#FFFFFF;
  --text-main:#102A26;
  --border-light:#B8CDC8;

  --cb-deep:#073B34;
  --cb-deep-2:#0A4A41;
  --cb-primary:#08695D;
  --cb-primary-hover:#055248;
  --cb-soft:#DDEAE7;
  --cb-gold-soft:#FFF3D6;
  --cb-success:#13795B;
  --cb-danger:#B42318;
}

/* ===== Global ===== */
html,body{
  background:#E9F0EE !important;
  color:#263C38 !important;
}

body,p,li,td{
  color:#344B46;
}

a{color:#075A50;}
a:hover{color:#043F38;}

h1,h2,h3,h4,h5,h6,
.card-title,.pane-title,.section-title,.portal-header h1{
  color:#102A26 !important;
}

.text-muted,.muted,.helper-text,.form-text,.subtitle,.description{
  color:#536661 !important;
}

/* ===== Cards ===== */
.card,.dashboard-card,.step-card,.content-card,.form-card,.panel,.pane,.modal-content,
.loan-card,.application-card,.info-card{
  background:#FFFFFF !important;
  border-color:#B8CDC8 !important;
  color:#263C38 !important;
  box-shadow:0 8px 24px rgba(7,59,52,.10) !important;
}

/* ===== Forms ===== */
label,.form-label,.field-label{
  color:#203B36 !important;
  font-weight:600;
}

input,select,textarea,.form-control,.form-select{
  background:#FFFFFF !important;
  color:#172E2A !important;
  border:1px solid #9FBAB4 !important;
}

input::placeholder,textarea::placeholder{
  color:#71847F !important;
  opacity:1;
}

input:focus,select:focus,textarea:focus,
.form-control:focus,.form-select:focus{
  border-color:#08695D !important;
  box-shadow:0 0 0 3px rgba(8,105,93,.16) !important;
}

/* ===== Buttons ===== */
.btn-primary,.primary-btn,.cta-btn,button[type="submit"]{
  background:#08695D !important;
  border-color:#08695D !important;
  color:#FFFFFF !important;
  font-weight:700;
}

.btn-primary:hover,.primary-btn:hover,.cta-btn:hover,button[type="submit"]:hover{
  background:#055248 !important;
  border-color:#055248 !important;
  color:#FFFFFF !important;
}

.btn-secondary,.secondary-btn{
  background:#FFFFFF !important;
  color:#075A50 !important;
  border:1px solid #7EA59D !important;
}

/* ===== Header / Navigation ===== */
header,.site-header,.navbar,.topbar,.account-topbar,.sidebar,.crm-sidebar{
  background:#073B34 !important;
  color:#FFFFFF !important;
}

header a,.site-header a,.navbar a,.topbar a,.account-topbar a,
.sidebar a,.crm-sidebar a{
  color:#FFFFFF !important;
}

/* Keep text visible on dark navigation */
header p,header span,header strong,
.site-header p,.site-header span,.site-header strong,
.navbar span,.navbar strong,
.topbar span,.topbar strong,
.sidebar span,.sidebar strong,
.crm-sidebar span,.crm-sidebar strong{
  color:#FFFFFF;
}

/* ===== Footer ===== */
footer,.site-footer{
  background:#052E29 !important;
  color:#DCE8E5 !important;
}

footer p,footer span,.site-footer p,.site-footer span{
  color:#DCE8E5 !important;
}

footer a,.site-footer a{
  color:#FFFFFF !important;
}

/* ===== Customer Journey ===== */
.journey-container,
.journey-container p,
.journey-container span,
.journey-container label{
  color:#263C38;
}

.step-content h2,
.step-content h3{
  color:#102A26 !important;
}

.step-content p,
.step-description{
  color:#465D58 !important;
}

.step-content label{
  color:#183A34 !important;
  font-weight:600;
}

.step-content input,
.step-content select,
.step-content textarea{
  color:#172E2A !important;
}

.step-content .form-text,
.step-content small,
.step-content .helper-text{
  color:#536661 !important;
}

/* ===== Journey Progress ===== */
.progress-bar,.progress-fill,.wizard-progress-fill{
  background:#D28B18 !important;
}

.step-indicator.completed,.progress-step.completed{
  background:#08695D !important;
  color:#FFFFFF !important;
}

.step-indicator.active,.progress-step.active{
  border-color:#D28B18 !important;
  color:#102A26 !important;
}

.step-label,
.progress-step .label{
  color:#294943 !important;
  font-weight:600;
}

.progress-step.active .label,
.step-indicator.active + .step-label{
  color:#A75F00 !important;
}

/* ===== Slider Values ===== */
.slider-value,.range-value,.amount-value,.tenure-value{
  color:#B96E00 !important;
  font-weight:700;
}

.range-labels,.range-labels span,
.slider-limits,.slider-limits span{
  color:#8B5700 !important;
  font-weight:600;
}

/* ===== Quick Fill / Smart Prefill Banner =====
   Multiple selectors are included to support the existing journey markup.
*/
.quick-fill,.quick-fill-box,.smart-prefill,.prefill-banner,
.quick-fill-banner,.smart-prefill-banner,.prefill-strip,
[class*="quick-fill"],[class*="quickfill"],[class*="prefill"]{
  background:#E3F0ED !important;
  border:1px solid #9FC6BF !important;
  border-radius:12px !important;
  color:#284B45 !important;
}

/* Readable normal text */
.quick-fill span,.quick-fill-box span,.smart-prefill span,.prefill-banner span,
.quick-fill-banner span,.smart-prefill-banner span,.prefill-strip span,
[class*="quick-fill"] span,[class*="quickfill"] span,[class*="prefill"] span{
  color:#365B54 !important;
}

/* Heading / strong text */
.quick-fill strong,.quick-fill-box strong,.smart-prefill strong,.prefill-banner strong,
.quick-fill-banner strong,.smart-prefill-banner strong,.prefill-strip strong,
[class*="quick-fill"] strong,[class*="quickfill"] strong,[class*="prefill"] strong{
  color:#073B34 !important;
  font-weight:800 !important;
}

/* Icon */
.quick-fill i,.quick-fill-box i,.smart-prefill i,.prefill-banner i,
.quick-fill-banner i,.smart-prefill-banner i,.prefill-strip i,
[class*="quick-fill"] i,[class*="quickfill"] i,[class*="prefill"] i{
  color:#B96E00 !important;
}

/* Gold upload/autofill CTA */
.quick-fill button,.quick-fill-box button,.smart-prefill button,.prefill-banner button,
.quick-fill-banner button,.smart-prefill-banner button,.prefill-strip button,
.quick-fill .btn,.quick-fill-box .btn,.smart-prefill .btn,.prefill-banner .btn,
[class*="quick-fill"] button,[class*="quickfill"] button,[class*="prefill"] button{
  background:#D28B18 !important;
  color:#FFFFFF !important;
  border:1px solid #D28B18 !important;
  border-radius:8px !important;
  font-weight:700 !important;
  box-shadow:none !important;
}

.quick-fill button:hover,.quick-fill-box button:hover,.smart-prefill button:hover,
.prefill-banner button:hover,.quick-fill-banner button:hover,
.smart-prefill-banner button:hover,.prefill-strip button:hover,
[class*="quick-fill"] button:hover,[class*="quickfill"] button:hover,
[class*="prefill"] button:hover{
  background:#B9730C !important;
  border-color:#B9730C !important;
  color:#FFFFFF !important;
}

/* ===== File Upload ===== */
.upload-box,.upload-zone,.file-drop-zone{
  background:#F4F8F7 !important;
  border-color:#9FBAB4 !important;
  color:#263C38 !important;
}

.upload-box:hover,.upload-zone:hover,.file-drop-zone:hover{
  background:#E7F1EF !important;
  border-color:#08695D !important;
}

/* ===== Tables ===== */
table{
  background:#FFFFFF !important;
  color:#263C38 !important;
}

th{
  background:#DDEAE7 !important;
  color:#102A26 !important;
  font-weight:700;
}

td{
  border-color:#CBDAD7 !important;
  color:#304742 !important;
}

/* ===== Alerts ===== */
.alert-success,.success-box{
  background:#E7F7F0 !important;
  color:#145A43 !important;
  border-color:#9FD7C2 !important;
}

.alert-warning,.warning-box{
  background:#FFF3D6 !important;
  color:#704800 !important;
  border-color:#E4C26D !important;
}

.alert-danger,.error-box{
  background:#FDECEC !important;
  color:#8F1D1D !important;
  border-color:#EAB1B1 !important;
}

/* ===== Continue / Journey CTA ===== */
.step-content .btn-primary,
.step-content button[type="submit"]{
  background:#087568 !important;
  color:#FFFFFF !important;
  border-color:#087568 !important;
  font-weight:700;
}

.step-content .btn-primary:hover,
.step-content button[type="submit"]:hover{
  background:#055A50 !important;
  border-color:#055A50 !important;
}

/* ===== Mobile ===== */
@media (max-width:768px){
  .quick-fill,.quick-fill-box,.smart-prefill,.prefill-banner,
  .quick-fill-banner,.smart-prefill-banner,.prefill-strip,
  [class*="quick-fill"],[class*="quickfill"],[class*="prefill"]{
    gap:12px;
  }
}
/* =========================================================
   QUICK FILL / OCR BANNER - EXACT DASHBOARD SELECTORS
   ========================================================= */

.ocr-banner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;

    background: #E3F0ED !important;
    border: 1px solid #9FC6BF !important;
    border-radius: 12px !important;

    padding: 16px 20px !important;
    margin: 20px 0 !important;

    color: #365B54 !important;

    box-shadow: 0 3px 10px rgba(7, 59, 52, 0.05) !important;
}

/* All normal text inside banner */
.ocr-banner,
.ocr-banner span,
.ocr-banner p {
    color: #365B54 !important;
}

/* Quick Fill heading */
.ocr-banner strong {
    color: #073B34 !important;
    font-weight: 800 !important;
}

/* Lightning icon */
.ocr-banner i,
.ocr-banner svg {
    color: #D28B18 !important;
}

/* Upload & Auto-Fill button */
.ocr-banner .ocr-btn,
.ocr-btn {
    background: #D28B18 !important;
    color: #FFFFFF !important;

    border: none !important;
    border-radius: 8px !important;

    padding: 11px 18px !important;

    font-size: 13px !important;
    font-weight: 700 !important;

    white-space: nowrap !important;
    cursor: pointer !important;

    box-shadow: 0 3px 8px rgba(210, 139, 24, 0.20) !important;

    transition:
        background 0.2s ease,
        transform 0.2s ease,
        box-shadow 0.2s ease !important;
}

.ocr-banner .ocr-btn:hover,
.ocr-btn:hover {
    background: #B9730C !important;
    color: #FFFFFF !important;

    transform: translateY(-1px);

    box-shadow: 0 5px 12px rgba(185, 115, 12, 0.25) !important;
}

/* Mobile */
@media (max-width: 768px) {

    .ocr-banner {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 14px !important;
    }

    .ocr-banner .ocr-btn,
    .ocr-btn {
        width: 100% !important;
        text-align: center !important;
    }
}

/* =========================================================
   MY ACCOUNT BUTTON - VISIBILITY FIX
   ========================================================= */

.my-account-btn,
.myaccount-btn,
.account-btn,
a[href*="myaccount"],
a[href*="MyAccount"],
a[href*="my_account"],
a[href*="My_Account"] {
    background: #FFFFFF !important;
    color: #073B34 !important;

    border: 1px solid #9FC6BF !important;
    border-radius: 8px !important;

    font-weight: 700 !important;
    text-decoration: none !important;

    box-shadow: 0 2px 6px rgba(7, 59, 52, 0.08) !important;
}

/* Force nested text/icon to remain visible */
.my-account-btn *,
.myaccount-btn *,
.account-btn *,
a[href*="myaccount"] *,
a[href*="MyAccount"] *,
a[href*="my_account"] *,
a[href*="My_Account"] * {
    color: #073B34 !important;
}

/* Hover */
.my-account-btn:hover,
.myaccount-btn:hover,
.account-btn:hover,
a[href*="myaccount"]:hover,
a[href*="MyAccount"]:hover,
a[href*="my_account"]:hover,
a[href*="My_Account"]:hover {
    background: #E3F0ED !important;
    color: #055248 !important;
    border-color: #08695D !important;
}

/* =========================================================
   DROPDOWN / SELECT VISIBILITY FIX
   ========================================================= */

select,
.form-select,
.step-content select {
    background-color: #FFFFFF !important;
    color: #172E2A !important;
    border: 1px solid #9FBAB4 !important;

    -webkit-text-fill-color: #172E2A !important;
    opacity: 1 !important;
}

/* Dropdown options */
select option,
.form-select option,
.step-content select option {
    background: #FFFFFF !important;
    color: #172E2A !important;
    -webkit-text-fill-color: #172E2A !important;
}

/* Selected value */
select option:checked,
.form-select option:checked {
    background: #E3F0ED !important;
    color: #073B34 !important;
}

/* Disabled/default option */
select option:disabled {
    color: #64748B !important;
}

/* Focus */
select:focus,
.form-select:focus,
.step-content select:focus {
    background-color: #FFFFFF !important;
    color: #172E2A !important;
    border-color: #08695D !important;
    box-shadow: 0 0 0 3px rgba(8, 105, 93, 0.16) !important;
}

/* Prevent parent/global white-text rules affecting dropdown */
.card select,
.dashboard-card select,
.step-card select,
.form-card select,
.journey-container select {
    color: #172E2A !important;
    -webkit-text-fill-color: #172E2A !important;
}

/* =========================================================
   LOAN AMOUNT + TENURE SLIDER IMPROVEMENT
   ========================================================= */

.loan-range-group,
.range-group,
.slider-group {
    background: #F7FAF9;
    border: 1px solid #D2E0DD;
    border-radius: 12px;
    padding: 16px 18px;
    margin-bottom: 14px;
}

/* Heading row */
.range-header,
.slider-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 12px;
}

.range-header label,
.slider-header label {
    margin: 0 !important;
    color: #203B36 !important;
    font-size: 14px;
    font-weight: 600;
}

/* Current selected value */
.range-current,
.slider-value,
.amount-value,
.tenure-value {
    display: inline-flex;
    align-items: center;

    background: #FFF3D6;
    color: #9A5D00 !important;

    border: 1px solid #E5C477;
    border-radius: 7px;

    padding: 5px 10px;

    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
}

/* Range slider */
.loan-range-group input[type="range"],
.range-group input[type="range"],
.slider-group input[type="range"] {
    width: 100% !important;
    margin: 3px 0 7px !important;
    accent-color: #087568;
}

/* Min / max values */
.range-limits,
.slider-limits,
.range-labels {
    display: flex;
    justify-content: space-between;
    align-items: center;

    width: 100%;

    font-size: 12px;
    font-weight: 600;
}

.range-limits span,
.slider-limits span,
.range-labels span {
    color: #647A75 !important;
}

/* Mobile */
@media (max-width: 600px) {

    .loan-range-group,
    .range-group,
    .slider-group {
        padding: 14px;
    }

    .range-header,
    .slider-header {
        align-items: flex-start;
    }

    .range-current,
    .slider-value,
    .amount-value,
    .tenure-value {
        font-size: 13px;
    }
}

/* =========================================================
   Credit Baniya V5 UI Refinement — exact Step 0 component
   Unique cb-* classes avoid collisions with homepage calculator.
   ========================================================= */

.cb-step-intro{
  color:#465D58 !important;
  margin:-8px 0 22px !important;
  font-size:15px;
}

.cb-loan-range{
  display:block !important;
  width:100% !important;
  background:#F8FBFA !important;
  border:1px solid #C7DAD6 !important;
  border-radius:14px !important;
  padding:18px 20px 16px !important;
  margin:0 0 16px !important;
  box-shadow:0 4px 14px rgba(7,59,52,.045) !important;
}

.cb-loan-range__head{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;
  width:100% !important;
  margin:0 0 14px !important;
}

.cb-loan-range__head label{
  display:block !important;
  margin:0 !important;
  color:#173B35 !important;
  font-size:14px !important;
  line-height:1.35 !important;
  font-weight:700 !important;
}

.cb-loan-range__value{
  display:inline-flex !important;
  flex:0 0 auto !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:100px !important;
  background:#FFF3D6 !important;
  color:#8D5500 !important;
  border:1px solid #E1B956 !important;
  border-radius:9px !important;
  padding:7px 12px !important;
  font-size:14px !important;
  line-height:1.2 !important;
  font-weight:800 !important;
  white-space:nowrap !important;
}

.cb-loan-range__input{
  display:block !important;
  position:static !important;
  float:none !important;
  width:100% !important;
  max-width:none !important;
  height:24px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  accent-color:#087568 !important;
}

.cb-loan-range__input::-webkit-slider-runnable-track{
  height:6px;
  border-radius:999px;
  background:#D4E2DF;
}
.cb-loan-range__input::-webkit-slider-thumb{
  margin-top:-5px;
}
.cb-loan-range__input::-moz-range-track{
  height:6px;
  border-radius:999px;
  background:#D4E2DF;
}

.cb-loan-range__limits{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  width:100% !important;
  margin:4px 0 0 !important;
  padding:0 !important;
  gap:20px !important;
}

.cb-loan-range__limits span{
  display:block !important;
  color:#607570 !important;
  font-size:12px !important;
  line-height:1.3 !important;
  font-weight:600 !important;
  white-space:nowrap !important;
}

.cb-loan-range__limits span:last-child{
  margin-left:auto !important;
  text-align:right !important;
}

.cb-field-hint{
  display:block;
  margin-top:6px;
  color:#536661 !important;
}

/* Exact dashboard visibility corrections */
.acc-card{
  background:#FFFFFF !important;
  color:#263C38 !important;
  border-color:#B8CDC8 !important;
}
.portal-header h1,.pane-title{
  color:#102A26 !important;
}
.portal-header p{
  color:#536661 !important;
}
.my-account-btn{
  background:#FFFFFF !important;
  color:#073B34 !important;
  border-color:#9FC6BF !important;
}
.ocr-banner{
  background:#E3F0ED !important;
  border:1px solid #9FC6BF !important;
  color:#365B54 !important;
}
.ocr-banner strong{color:#073B34 !important;}
.ocr-btn{
  background:#D28B18 !important;
  color:#FFFFFF !important;
}

/* Keep native selects readable in all journey panes */
.step-pane select,
.step-pane select option{
  background:#FFFFFF !important;
  color:#172E2A !important;
  -webkit-text-fill-color:#172E2A !important;
}

@media (max-width:600px){
  .cb-loan-range{
    padding:15px 16px 14px !important;
  }
  .cb-loan-range__head{
    gap:10px !important;
    margin-bottom:12px !important;
  }
  .cb-loan-range__head label{
    font-size:13px !important;
  }
  .cb-loan-range__value{
    min-width:auto !important;
    padding:6px 9px !important;
    font-size:13px !important;
  }
  .cb-loan-range__limits span{
    font-size:11px !important;
  }
}

/* =========================================================
   CREDIT BANIYA HEADER LOGO - FINAL v2.2
   Optimized for wide transparent header logo
   ========================================================= */

.cb-brand-logo {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 260px !important;
    height: 64px !important;
    max-width: 260px !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    flex: 0 0 260px !important;
    text-decoration: none !important;
}

.cb-brand-logo img {
    display: block !important;
    width: 260px !important;
    height: auto !important;
    max-width: 260px !important;
    max-height: 58px !important;
    object-fit: contain !important;
    object-position: left center !important;
    margin: 0 !important;
    padding: 0 !important;
}

@media (max-width: 900px) {
    .cb-brand-logo {
        width: 230px !important;
        max-width: 230px !important;
        height: 58px !important;
        flex: 0 0 230px !important;
    }

    .cb-brand-logo img {
        width: 230px !important;
        max-width: 230px !important;
        max-height: 52px !important;
    }
}

@media (max-width: 600px) {
    .cb-brand-logo {
        width: 190px !important;
        max-width: 190px !important;
        height: 52px !important;
        flex: 0 0 190px !important;
    }

    .cb-brand-logo img {
        width: 190px !important;
        max-width: 190px !important;
        max-height: 46px !important;
    }
}
