/* ============================
   Credite NP — Public Styles v1.1.24
   Theme isolation: toate regulile vizuale critice folosesc !important
   ============================ */

/* ============================
   FULL-WIDTH BREAKOUT ROBUST
   Metoda position+transform: functioneaza si cu overflow:hidden pe body/main
   ============================ */

/* Anulam orice constrangere de latime mostenita pe #cnp-calculator si copiii directi */
#cnp-calculator,
#cnp-calculator .cnp-calculator-wrap,
#cnp-calculator .cnp-inner,
#cnp-calculator #cnp-form,
#cnp-calculator .cnp-form-card,
#cnp-calculator #cnp-rezultate,
#cnp-calculator .cnp-offer-form-inline {
    max-width: none !important;
    float: none !important;
    clear: both !important;
}

/* Form — tema suprascrie frecvent <form> cu max-width/margin/padding */
#cnp-calculator #cnp-form {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    display: block !important;
}

#cnp-calculator .cnp-form-card {
    width: 100% !important;
    box-sizing: border-box !important;
}

#cnp-calculator #cnp-rezultate {
    width: 100% !important;
    box-sizing: border-box !important;
}

/* ============================
   RESET & IZOLARE COMPLETĂ DE TEMĂ
   ============================ */

#cnp-calculator *,
#cnp-calculator *::before,
#cnp-calculator *::after {
    box-sizing: border-box !important;
}

/* Reset heading-uri — temele stilizeaza agresiv h1-h6 */
#cnp-calculator h1,
#cnp-calculator h2,
#cnp-calculator h3,
#cnp-calculator h4,
#cnp-calculator h5,
#cnp-calculator h6 {
    margin: 0 !important;
    padding: 0 !important;
    font-style: normal !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    border: none !important;
    background: none !important;
    box-shadow: none !important;
    line-height: 1.3 !important;
    color: inherit !important;
}

#cnp-calculator p {
    margin: 0 !important;
    padding: 0 !important;
}

#cnp-calculator a {
    text-decoration: none !important;
    color: inherit !important;
    box-shadow: none !important;
}

#cnp-calculator ul,
#cnp-calculator ol {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Reset input/button — temele le rescriu aproape intotdeauna */
#cnp-calculator input,
#cnp-calculator button,
#cnp-calculator select,
#cnp-calculator textarea {
    font-family: inherit !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    outline: none !important;
}

/* ============================
   FULL-WIDTH BREAKOUT
   ============================ */
#cnp-calculator {
    /* Breakout full-width robust — functioneaza chiar daca tema are overflow:hidden */
    position: relative !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    background: transparent !important;
    display: block !important;
    line-height: 1.5 !important;
    letter-spacing: normal !important;
    word-spacing: normal !important;
    text-transform: none !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

/* Container interior centrat */
.cnp-inner {
    width: 100% !important;
    max-width: 1400px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 32px 24px 48px !important;
    box-sizing: border-box !important;
    background: transparent !important;
}

.cnp-calculator-wrap {
    box-sizing: border-box !important;
    font-family: var(--cnp-font, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif) !important;
    color: var(--cnp-text, #000000) !important;
    background: transparent !important;
}

#cnp-form,
#cnp-rezultate {
    width: 100% !important;
    box-sizing: border-box !important;
}

#cnp-rezultate {
    margin-top: 32px !important;
}

.cnp-titlu {
    font-size: 1.8em !important;
    font-weight: 700 !important;
    text-align: center !important;
    margin-top: 0 !important;
    margin-bottom: 28px !important;
    color: var(--cnp-text, #000000) !important;
    line-height: 1.3 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    border: none !important;
    background: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* Steps container — grid stacking: ambele pasuri ocupa acelasi spatiu */
.cnp-steps-container {
    display: grid !important;
    margin-bottom: 20px !important;
}

/* Form Steps */
.cnp-step {
    grid-row: 1 !important;
    grid-column: 1 !important;
    background: #ffffff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 10px !important;
    padding: 24px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.06) !important;
    visibility: hidden !important;
    pointer-events: none !important;
    user-select: none !important;
}
.cnp-step.cnp-step-visible {
    visibility: visible !important;
    pointer-events: auto !important;
    user-select: auto !important;
}

.cnp-step-title {
    font-size: 1.1em !important;
    font-weight: 700 !important;
    color: var(--cnp-text, #000000) !important;
    margin-top: 0 !important;
    margin-bottom: 20px !important;
    padding-bottom: 12px !important;
    border-bottom: 2px solid #f0f0f0 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    background: none !important;
    box-shadow: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.3 !important;
}

/* Step navigation */
.cnp-step-nav {
    margin-top: 24px !important;
}
.cnp-step-nav-dual {
    display: flex !important;
    gap: 12px !important;
    align-items: center !important;
}
.cnp-step-nav-dual .cnp-btn-prev { flex: 0 0 auto !important; }
.cnp-step-nav-dual .cnp-btn-next,
.cnp-step-nav-dual #cnp-btn-calcul { flex: 1 !important; }
.cnp-btn-full { width: 100% !important; display: block !important; text-align: center !important; }

/* ============================
   INLINE FIELD ROW (Pasul 1 & 2)
   ============================ */
.cnp-inline-row {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px 24px !important;
    align-items: start !important;
    margin-bottom: 4px !important;
}
.cnp-inline-row-6 {
    grid-template-columns: repeat(6, 1fr) !important;
    gap: 12px 16px !important;
}
.cnp-inline-row-prefs {
    grid-template-columns: repeat(4, 1fr) !important;
}
.cnp-inline-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    min-width: 0 !important;
}
.cnp-inline-label {
    display: block !important;
    font-weight: 600 !important;
    font-size: .88em !important;
    color: #555 !important;
    margin-bottom: 8px !important;
    white-space: normal !important;
    line-height: 1.3 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}
/* Radio pills stacked vertically inside column */
.cnp-radio-group-col {
    flex-direction: column !important;
    gap: 6px !important;
}
.cnp-radio-group-col .cnp-radio-label {
    width: 100% !important;
    justify-content: flex-start !important;
}

/* Field groups (legacy) */
.cnp-field-group { margin-bottom: 18px !important; }
.cnp-field-group:last-child { margin-bottom: 0 !important; }
.cnp-field-group label {
    display: block !important;
    font-weight: 600 !important;
    margin-bottom: 6px !important;
    color: #333 !important;
    font-size: .95em !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* ============================
   INPUTS
   ============================ */
.cnp-input {
    width: 100% !important;
    padding: 10px 14px !important;
    border: 1.5px solid #ccc !important;
    border-radius: 6px !important;
    font-size: 1em !important;
    font-family: inherit !important;
    color: #333 !important;
    background: #ffffff !important;
    transition: border-color .2s !important;
    box-sizing: border-box !important;
    outline: none !important;
    box-shadow: none !important;
    line-height: 1.4 !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}
.cnp-input:focus {
    border-color: var(--cnp-color, #ff0101) !important;
    box-shadow: 0 0 0 3px rgba(255,1,1,.15) !important;
    outline: none !important;
}
.cnp-input.cnp-invalid { border-color: #c0392b !important; }

/* Input with unit suffix */
.cnp-input-wrap {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
}
.cnp-input-has-unit {
    padding-right: 52px !important;
}
.cnp-input-unit {
    position: absolute !important;
    right: 14px !important;
    color: #888 !important;
    font-size: .9em !important;
    font-weight: 600 !important;
    pointer-events: none !important;
    user-select: none !important;
}

/* ============================
   RANGE SLIDER
   ============================ */
.cnp-range {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 100% !important;
    height: 6px !important;
    border-radius: 3px !important;
    border: none !important;
    touch-action: pan-y !important;
    background: linear-gradient(to right, var(--cnp-color, #ff0101) 0%, var(--cnp-color, #ff0101) var(--fill, 0%), #e0e0e0 var(--fill, 0%), #e0e0e0 100%) !important;
    outline: none !important;
    cursor: pointer !important;
    margin: 10px 0 4px !important;
    padding: 0 !important;
    box-shadow: none !important;
}
.cnp-range::-webkit-slider-thumb {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 22px !important;
    height: 22px !important;
    border-radius: 50% !important;
    background: var(--cnp-color, #ff0101) !important;
    border: 3px solid #fff !important;
    box-shadow: 0 1px 6px rgba(0,0,0,.25) !important;
    cursor: pointer !important;
    transition: box-shadow .15s !important;
}
.cnp-range::-webkit-slider-thumb:hover {
    box-shadow: 0 0 0 6px rgba(255,1,1,.15), 0 1px 6px rgba(0,0,0,.25) !important;
}
.cnp-range::-moz-range-thumb {
    width: 22px !important;
    height: 22px !important;
    border-radius: 50% !important;
    background: var(--cnp-color, #ff0101) !important;
    border: 3px solid #fff !important;
    box-shadow: 0 1px 6px rgba(0,0,0,.25) !important;
    cursor: pointer !important;
}
.cnp-range::-moz-range-track {
    height: 6px !important;
    border-radius: 3px !important;
    background: #e0e0e0 !important;
}
.cnp-range-labels {
    display: flex !important;
    justify-content: space-between !important;
    font-size: .78em !important;
    color: #999 !important;
    margin-top: 2px !important;
}
.cnp-range-field-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: baseline !important;
    margin-bottom: 4px !important;
}
.cnp-range-field-header label {
    margin-bottom: 0 !important;
}
.cnp-range-cur-val {
    font-size: .95em !important;
    font-weight: 700 !important;
    color: var(--cnp-color, #ff0101) !important;
}

/* ============================
   RADIO GROUP
   ============================ */
.cnp-radio-group {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
}
.cnp-radio-label {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    cursor: pointer !important;
    padding: 8px 14px !important;
    border: 1.5px solid #ddd !important;
    border-radius: 6px !important;
    font-weight: 400 !important;
    font-size: .9em !important;
    transition: all .2s !important;
    user-select: none !important;
    background: #ffffff !important;
    color: #333 !important;
    line-height: 1.4 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    box-shadow: none !important;
}
.cnp-radio-label:hover {
    border-color: var(--cnp-color, #ff0101) !important;
    background: #fff5f5 !important;
    color: #333 !important;
}
.cnp-radio-label input[type="radio"] {
    margin: 0 !important;
    cursor: pointer !important;
    -webkit-appearance: auto !important;
    appearance: auto !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
    flex-shrink: 0 !important;
}
.cnp-radio-label:has(input:checked) {
    border-color: var(--cnp-color, #ff0101) !important;
    background: #fff0f0 !important;
    font-weight: 600 !important;
}

/* ============================
   HINT & ERROR
   ============================ */
.cnp-hint {
    display: block !important;
    font-size: .82em !important;
    color: #666 !important;
    margin-top: 4px !important;
    line-height: 1.4 !important;
    text-transform: none !important;
}
.cnp-error {
    display: block !important;
    font-size: .85em !important;
    color: #c0392b !important;
    margin-top: 4px !important;
    min-height: 38px !important;
    line-height: 1.3 !important;
}

/* ============================
   TOOLTIP
   ============================ */
.cnp-tooltip {
    cursor: help !important;
    font-size: .9em !important;
    position: relative !important;
}
.cnp-tooltip:hover::after {
    content: attr(data-tip) !important;
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    bottom: calc(100% + 6px) !important;
    background: #333 !important;
    color: #fff !important;
    padding: 8px 12px !important;
    border-radius: 6px !important;
    font-size: .82em !important;
    width: 280px !important;
    white-space: normal !important;
    z-index: 9999 !important;
    pointer-events: none !important;
    line-height: 1.4 !important;
    font-weight: 400 !important;
    text-align: left !important;
    box-shadow: 0 4px 12px rgba(0,0,0,.2) !important;
    letter-spacing: normal !important;
    text-transform: none !important;
}

/* ============================
   BUTOANE
   ============================ */
.cnp-submit-wrap {
    text-align: center !important;
    margin: 24px 0 !important;
}
.cnp-btn {
    display: inline-block !important;
    padding: 14px 36px !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 1.05em !important;
    font-weight: 700 !important;
    font-family: inherit !important;
    cursor: pointer !important;
    transition: all .2s !important;
    text-decoration: none !important;
    line-height: 1.4 !important;
    text-align: center !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    outline: none !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
}
.cnp-btn-primary {
    background: var(--cnp-color, #ff0101) !important;
    color: #fff !important;
    border: none !important;
    box-shadow: none !important;
}
.cnp-btn-primary:hover {
    filter: brightness(1.1) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(0,0,0,.15) !important;
    background: var(--cnp-color, #ff0101) !important;
    color: #fff !important;
    text-decoration: none !important;
}
.cnp-btn-primary:active { transform: translateY(0) !important; }
.cnp-btn-primary:disabled {
    opacity: .6 !important;
    cursor: not-allowed !important;
    transform: none !important;
}
.cnp-btn-secondary {
    background: #fff !important;
    color: #555 !important;
    border: 2px solid #ccc !important;
    box-shadow: none !important;
}
.cnp-btn-secondary:hover {
    background: #f9f9f9 !important;
    border-color: #aaa !important;
    color: #333 !important;
    text-decoration: none !important;
}

/* ============================
   GRAD ÎNDATORARE
   ============================ */
.cnp-grad-indatorare-box {
    background: #fff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 8px !important;
    padding: 20px 24px !important;
    margin-bottom: 24px !important;
    box-shadow: 0 2px 4px rgba(0,0,0,.05) !important;
}
.cnp-grad-header {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-bottom: 12px !important;
}
.cnp-grad-label {
    font-weight: 600 !important;
    font-size: 1em !important;
    color: #333 !important;
}
.cnp-grad-value {
    font-size: 1.4em !important;
    font-weight: 800 !important;
}
.cnp-grad-value.verde { color: #27ae60 !important; }
.cnp-grad-value.galben { color: #f39c12 !important; }
.cnp-grad-value.rosu { color: #c0392b !important; }

.cnp-grad-bar-wrap {
    position: relative !important;
    height: 16px !important;
    background: linear-gradient(to right, #27ae60 0%, #f39c12 30%, #c0392b 50%, #8e0000 100%) !important;
    border-radius: 8px !important;
    margin-bottom: 8px !important;
    overflow: visible !important;
}
.cnp-grad-bar {
    position: absolute !important;
    top: -4px !important;
    width: 18px !important;
    height: 24px !important;
    background: #333 !important;
    border-radius: 4px !important;
    transform: translateX(-50%) !important;
    transition: left .5s ease !important;
    box-shadow: 0 2px 6px rgba(0,0,0,.3) !important;
}
.cnp-grad-limit {
    position: absolute !important;
    top: -6px !important;
    width: 2px !important;
    height: 28px !important;
    background: rgba(0,0,0,.6) !important;
    transform: translateX(-50%) !important;
}
.cnp-grad-legend {
    display: flex !important;
    gap: 16px !important;
    font-size: .8em !important;
}
.cnp-legend {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    color: #333 !important;
}
.cnp-legend::before { content: '●' !important; }
.cnp-legend.verde::before { color: #27ae60 !important; }
.cnp-legend.galben::before { color: #f39c12 !important; }
.cnp-legend.rosu::before { color: #c0392b !important; }

.cnp-avertisment {
    background: #fff3cd !important;
    border: 1px solid #ffc107 !important;
    border-radius: 6px !important;
    padding: 10px 14px !important;
    margin-top: 12px !important;
    font-size: .9em !important;
    color: #856404 !important;
    line-height: 1.4 !important;
}

/* ============================
   CARDURI OFERTE
   ============================ */
.cnp-lista-oferte {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
    align-items: stretch !important;
}

.cnp-card-oferta {
    background: #ffffff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.06) !important;
    transition: transform .2s, box-shadow .2s !important;
    display: flex !important;
    flex-direction: column !important;
}
.cnp-card-oferta:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(0,0,0,.1) !important;
}

.cnp-card-body {
    padding: 20px !important;
    flex: 1 !important;
    background: #ffffff !important;
}

/* Highlight primar - Rata Lunara */
.cnp-highlight-primary {
    text-align: center !important;
    margin-bottom: 12px !important;
    padding: 14px 0 10px !important;
    border-bottom: 1px solid #f0f0f0 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    background: none !important;
}
.cnp-highlight-primary-value {
    display: block !important;
    font-size: 2.2em !important;
    font-weight: 900 !important;
    color: var(--cnp-color, #ff0101) !important;
    line-height: 1.1 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
}
.cnp-highlight-primary-label {
    display: block !important;
    font-size: .8em !important;
    color: #555 !important;
    margin-top: 4px !important;
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* Highlights secundare */
.cnp-highlight-secondary-group {
    display: flex !important;
    gap: 12px !important;
    margin-bottom: 14px !important;
    justify-content: center !important;
}
.cnp-highlight-secondary-item {
    flex: 1 !important;
    text-align: center !important;
    padding: 8px 6px !important;
    background: #f9f9f9 !important;
    border-radius: 6px !important;
    border: none !important;
}
.cnp-highlight-secondary-value {
    display: block !important;
    font-size: 1.05em !important;
    font-weight: 700 !important;
    color: #333 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
}
.cnp-highlight-secondary-label {
    display: block !important;
    font-size: .74em !important;
    color: #888 !important;
    margin-top: 2px !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

.cnp-card-details {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    padding: 14px !important;
    background: #f9f9f9 !important;
    border-radius: 8px !important;
    margin-bottom: 14px !important;
    font-size: .88em !important;
    border: none !important;
}
.cnp-detail-row {
    display: flex !important;
    justify-content: space-between !important;
    gap: 8px !important;
}
.cnp-detail-label {
    color: #666 !important;
    font-weight: 400 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}
.cnp-detail-value {
    font-weight: 600 !important;
    color: #222 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

.cnp-card-conditii {
    background: #fff8e1 !important;
    border: 1px solid #ffe082 !important;
    border-radius: 6px !important;
    padding: 10px 14px !important;
    margin-bottom: 14px !important;
    font-size: .88em !important;
    color: #5d4037 !important;
    line-height: 1.4 !important;
}
.cnp-card-conditii strong {
    display: block !important;
    margin-bottom: 4px !important;
    color: #5d4037 !important;
    font-weight: 700 !important;
}

.cnp-card-avertizari { margin-bottom: 14px !important; }
.cnp-avertizare-item {
    display: flex !important;
    align-items: flex-start !important;
    gap: 6px !important;
    padding: 6px 10px !important;
    background: #fff3e0 !important;
    border-left: 3px solid #ff9800 !important;
    border-radius: 0 4px 4px 0 !important;
    margin-bottom: 6px !important;
    font-size: .85em !important;
    color: #5d4037 !important;
    line-height: 1.4 !important;
}

.cnp-nota-dobanda {
    background: #e8f4fb !important;
    border: 1px solid #b3d9f0 !important;
    border-radius: 6px !important;
    padding: 10px 14px !important;
    margin-bottom: 14px !important;
    font-size: .85em !important;
    color: #1565c0 !important;
    line-height: 1.4 !important;
}

.cnp-card-footer {
    padding: 0 20px 20px !important;
    text-align: center !important;
    background: #ffffff !important;
}
.cnp-btn-oferta {
    width: 100% !important;
    background: var(--cnp-color, #ff0101) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 13px 24px !important;
    font-size: 1em !important;
    font-weight: 700 !important;
    font-family: inherit !important;
    cursor: pointer !important;
    transition: all .2s !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.4 !important;
    box-shadow: none !important;
    outline: none !important;
    display: block !important;
    text-align: center !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
}
.cnp-btn-descarca {
    width: 100% !important;
    margin-top: 0 !important;
    background: transparent !important;
    color: var(--cnp-color, #ff0101) !important;
    border: 1.5px solid var(--cnp-color, #ff0101) !important;
    border-radius: 8px !important;
    padding: 10px 12px !important;
    font-size: .92em !important;
    font-weight: 600 !important;
    font-family: inherit !important;
    cursor: pointer !important;
    transition: all .2s !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.4 !important;
    box-shadow: none !important;
    outline: none !important;
    display: block !important;
    text-align: center !important;
    box-sizing: border-box !important;
}
.cnp-btn-descarca:hover,
.cnp-btn-descarca.cnp-active {
    background: var(--cnp-color, #ff0101) !important;
    color: #fff !important;
}

/* Download Form */
.cnp-download-form {
    display: none;
    border-top: 1px solid #e8e8e8 !important;
    background: #fafafa !important;
}
.cnp-dl-inner {
    padding: 20px !important;
}
.cnp-dl-title {
    font-size: .95em !important;
    font-weight: 700 !important;
    color: #333 !important;
    margin-bottom: 14px !important;
}
.cnp-dl-field {
    margin-bottom: 10px !important;
}
.cnp-dl-label {
    display: block !important;
    font-size: .83em !important;
    font-weight: 600 !important;
    color: #555 !important;
    margin-bottom: 4px !important;
}
.cnp-dl-input {
    width: 100% !important;
    padding: 9px 12px !important;
    border: 1px solid #d0d0d0 !important;
    border-radius: 6px !important;
    font-size: .9em !important;
    font-family: inherit !important;
    color: inherit !important;
    background: #fff !important;
    box-sizing: border-box !important;
    outline: none !important;
    transition: border-color .15s !important;
    box-shadow: none !important;
}
.cnp-dl-input:focus {
    border-color: var(--cnp-color, #ff0101) !important;
}
.cnp-dl-error {
    min-height: 1.2em !important;
    color: #d32f2f !important;
    font-size: .82em !important;
    margin-bottom: 6px !important;
}
.cnp-dl-btn-submit {
    width: 100% !important;
    background: var(--cnp-color, #ff0101) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 11px 24px !important;
    font-size: .92em !important;
    font-weight: 700 !important;
    font-family: inherit !important;
    cursor: pointer !important;
    transition: all .2s !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.4 !important;
    box-shadow: none !important;
    outline: none !important;
    display: block !important;
    text-align: center !important;
    box-sizing: border-box !important;
}
.cnp-dl-btn-submit:hover {
    filter: brightness(1.1) !important;
}
.cnp-dl-success {
    display: none;
    margin-top: 10px !important;
    padding: 10px 14px !important;
    background: #e8f5e9 !important;
    border: 1px solid #a5d6a7 !important;
    border-radius: 6px !important;
    color: #2e7d32 !important;
    font-size: .88em !important;
    font-weight: 600 !important;
    text-align: center !important;
}

.cnp-btn-oferta:hover {
    filter: brightness(1.1) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(0,0,0,.15) !important;
    background: var(--cnp-color, #ff0101) !important;
    color: #fff !important;
    text-decoration: none !important;
}

/* ---- Scadențar ---- */
/* Footer 2 coloane */
.cnp-footer-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    margin-top: 8px !important;
}

.cnp-btn-scadentar {
    width: 100% !important;
    margin-top: 0 !important;
    background: transparent !important;
    color: var(--cnp-color, #ff0101) !important;
    border: 1.5px solid var(--cnp-color, #ff0101) !important;
    border-radius: 8px !important;
    padding: 10px 24px !important;
    font-size: .92em !important;
    font-weight: 600 !important;
    font-family: inherit !important;
    cursor: pointer !important;
    transition: all .2s !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.4 !important;
    box-shadow: none !important;
    outline: none !important;
    display: block !important;
    text-align: center !important;
    box-sizing: border-box !important;
}
.cnp-btn-scadentar:hover,
.cnp-btn-scadentar.cnp-active {
    background: var(--cnp-color, #ff0101) !important;
    color: #fff !important;
}

.cnp-scadentar {
    display: none;
    border-top: 1px solid #e8e8e8 !important;
}
.cnp-scadentar-header {
    padding: 12px 20px 8px !important;
    font-size: .85em !important;
    font-weight: 700 !important;
    color: #555 !important;
    text-transform: uppercase !important;
    letter-spacing: .05em !important;
}
.cnp-scadentar-scroll {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 0 20px 16px !important;
}
.cnp-scadentar-table {
    width: 100% !important;
    border-collapse: collapse !important;
    font-size: .82em !important;
    min-width: 520px !important;
    background: #fff !important;
    color: inherit !important;
}
.cnp-scadentar-table thead tr {
    background: #f5f5f5 !important;
}
.cnp-scadentar-table th {
    padding: 7px 10px !important;
    text-align: left !important;
    font-weight: 600 !important;
    color: #444 !important;
    border-bottom: 2px solid #e0e0e0 !important;
    white-space: nowrap !important;
}
.cnp-scadentar-table td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #f0f0f0 !important;
    vertical-align: middle !important;
    color: inherit !important;
}
.cnp-scadentar-table tbody tr:last-child td {
    border-bottom: none !important;
}
.cnp-scadentar-table tbody tr:hover td {
    background: #fafafa !important;
}
.cnp-s-num {
    text-align: right !important;
    font-variant-numeric: tabular-nums !important;
    white-space: nowrap !important;
}
.cnp-s-total {
    font-weight: 700 !important;
    color: var(--cnp-color, #ff0101) !important;
}

/* No results */
.cnp-no-results {
    text-align: center !important;
    padding: 40px !important;
    background: #fff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 8px !important;
    color: #666 !important;
}
.cnp-no-results p {
    color: #666 !important;
    font-size: 1em !important;
    line-height: 1.5 !important;
}

/* ============================
   FORMULAR INLINE OFERTĂ
   ============================ */
.cnp-offer-form-inline {
    grid-column: 1 / -1 !important;
    background: #fff !important;
    border: 2px solid var(--cnp-color, #ff0101) !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 20px rgba(0,0,0,.1) !important;
    margin-top: 4px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}
/* Când formularul e în interiorul unui card — fără border/shadow proprii */
.cnp-card-oferta .cnp-offer-form-inline {
    border: none !important;
    border-top: 2px solid var(--cnp-color, #ff0101) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin-top: 0 !important;
}
.cnp-offer-form-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 16px 20px !important;
    background: var(--cnp-header, #000000) !important;
    color: #fff !important;
}
.cnp-offer-form-title {
    font-size: 1em !important;
    font-weight: 700 !important;
    color: #fff !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}
.cnp-offer-form-close {
    background: none !important;
    border: none !important;
    font-size: 1.6em !important;
    cursor: pointer !important;
    color: rgba(255,255,255,.8) !important;
    padding: 0 !important;
    line-height: 1 !important;
    transition: color .15s !important;
    outline: none !important;
    box-shadow: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}
.cnp-offer-form-close:hover { color: #fff !important; }
.cnp-offer-form-body {
    padding: 24px !important;
    background: #ffffff !important;
}
.cnp-form-notice {
    color: #666 !important;
    text-align: center !important;
    padding: 20px !important;
    font-size: 1em !important;
}

/* Card header */
.cnp-card-header {
    background: var(--cnp-header, #000000) !important;
    color: #fff !important;
    padding: 16px 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
}
.cnp-card-banca-name {
    font-size: 1.1em !important;
    font-weight: 700 !important;
    color: #fff !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* ============================
   RESPONSIVE
   ============================ */

/* ---- Tablet (≤800px) ---- */
@media (max-width: 800px) {
    .cnp-inline-row          { grid-template-columns: repeat(2, 1fr) !important; }
    .cnp-inline-row-6        { grid-template-columns: repeat(3, 1fr) !important; gap: 14px 18px !important; }
    .cnp-inline-row-prefs    { grid-template-columns: repeat(2, 1fr) !important; }
    .cnp-lista-oferte        { grid-template-columns: 1fr !important; }
    .cnp-step-nav-dual       { flex-direction: column !important; }
    .cnp-step-nav-dual .cnp-btn-prev,
    .cnp-step-nav-dual #cnp-btn-calcul { width: 100% !important; flex: none !important; }
    .cnp-steps-container     { display: block !important; }
    .cnp-step                { display: none !important; visibility: visible !important; pointer-events: auto !important; user-select: auto !important; }
    .cnp-step.cnp-step-visible { display: block !important; }
}

/* ---- Mobile (≤600px) ---- */
@media (max-width: 600px) {
    /* Eliminam padding-urile laterale — calculatorul ocupa toata latimea ecranului */
    .cnp-inner               { padding: 0 0 24px !important; }
    .cnp-titlu               { font-size: 1.4em !important; margin-bottom: 14px !important; padding: 16px 16px 0 !important; }

    /* Step-urile devin edge-to-edge: fara border lateral, fara border-radius */
    .cnp-step                { padding: 16px !important; border-radius: 0 !important; border-left: none !important; border-right: none !important; }
    .cnp-step-title          { font-size: 1em !important; margin-bottom: 14px !important; padding-bottom: 10px !important; }

    /* Campurile — o singura coloana, gap redus */
    .cnp-inline-row,
    .cnp-inline-row-6,
    .cnp-inline-row-prefs    { grid-template-columns: 1fr !important; gap: 10px !important; }

    /* Highlight rata lunara */
    .cnp-highlight-primary-value { font-size: 1.7em !important; }

    /* Grad indatorare */
    .cnp-grad-indatorare-box { padding: 14px 16px !important; border-radius: 0 !important; border-left: none !important; border-right: none !important; }
    .cnp-grad-legend         { flex-wrap: wrap !important; gap: 8px !important; }

    /* Carduri oferte — edge-to-edge */
    .cnp-card-oferta         { border-radius: 0 !important; border-left: none !important; border-right: none !important; }
    .cnp-card-body           { padding: 14px 16px !important; }
    .cnp-card-footer         { padding: 0 16px 16px !important; }

    /* Formular oferta inline */
    .cnp-offer-form-inline   { border-radius: 0 !important; border-left: none !important; border-right: none !important; }
    .cnp-offer-form-body     { padding: 16px !important; }
    .cnp-offer-form-header   { padding: 12px 16px !important; }
}

/* ============================
   NOU DESIGN FORMULAR v1.1.14
   Card flat cu 3 sectiuni:
   sliders → câmpuri → preferinte
   ============================ */

/* Card principal */
.cnp-form-card {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    box-shadow: 0 4px 24px rgba(0,0,0,.08) !important;
    overflow: hidden !important;
}

/* Separator orizontal intre sectiuni */
.cnp-form-divider {
    height: 1px !important;
    background: #f0f4f8 !important;
    margin: 0 !important;
    border: none !important;
}

/* Sectiune generica */
.cnp-form-section {
    padding: 28px 32px !important;
}

/* ——————————————————————————
   SECTIUNEA 1: 3 slidere
   —————————————————————————— */
.cnp-form-section-sliders {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0 40px !important;
    align-items: start !important;
}

.cnp-slider-block {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
}

.cnp-slider-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: baseline !important;
    margin-bottom: 10px !important;
    min-height: 22px !important;
}

.cnp-slider-label {
    display: block !important;
    font-weight: 700 !important;
    font-size: .75em !important;
    color: #64748b !important;
    text-transform: uppercase !important;
    letter-spacing: .06em !important;
    line-height: 1.3 !important;
}

/* Eroare inline (langa label in slider-header) */
.cnp-error-inline {
    display: block !important;
    font-size: .78em !important;
    color: #c0392b !important;
    line-height: 1.3 !important;
    font-weight: 500 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* ——————————————————————————
   SECTIUNEA 2: Scop + Rate + FICO
   —————————————————————————— */
.cnp-form-section-secondary {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0 40px !important;
    align-items: start !important;
    background: #f8fafc !important;
}

.cnp-field-block {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

.cnp-field-label {
    display: block !important;
    font-weight: 700 !important;
    font-size: .75em !important;
    color: #64748b !important;
    text-transform: uppercase !important;
    letter-spacing: .06em !important;
    line-height: 1.3 !important;
    margin-bottom: 0 !important;
}

/* ——————————————————————————
   TOGGLE GROUP (segmented control)
   —————————————————————————— */
.cnp-toggle-group {
    display: flex !important;
    border: 1.5px solid #cbd5e1 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    background: #fff !important;
    box-shadow: none !important;
}

.cnp-toggle-opt {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 9px 10px !important;
    font-size: .88em !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    user-select: none !important;
    background: #fff !important;
    color: #475569 !important;
    transition: background .15s, color .15s !important;
    text-align: center !important;
    line-height: 1.3 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

.cnp-toggle-opt + .cnp-toggle-opt {
    border-left: 1.5px solid #cbd5e1 !important;
}

.cnp-toggle-opt input[type="radio"] {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Optiunea selectata */
.cnp-toggle-opt:has(input:checked) {
    background: var(--cnp-color, #ff0101) !important;
    color: #fff !important;
    font-weight: 700 !important;
}

/* ——————————————————————————
   SECTIUNEA 3: Preferinte
   —————————————————————————— */
.cnp-form-section-prefs {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 20px 32px !important;
    align-items: flex-start !important;
    background: #f8fafc !important;
    padding-top: 24px !important;
    padding-bottom: 24px !important;
}

.cnp-pref-block {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    flex: 1 !important;
    min-width: 130px !important;
}

.cnp-pref-label {
    display: block !important;
    font-weight: 700 !important;
    font-size: .75em !important;
    color: #64748b !important;
    text-transform: uppercase !important;
    letter-spacing: .06em !important;
    line-height: 1.3 !important;
    margin-bottom: 0 !important;
    white-space: nowrap !important;
}

/* ——————————————————————————
   BUTON SUBMIT
   —————————————————————————— */
.cnp-form-submit {
    padding: 20px 32px !important;
    background: #ffffff !important;
    border-top: 1px solid #f0f4f8 !important;
}

.cnp-form-submit .cnp-btn {
    width: 100% !important;
    padding: 16px 24px !important;
    font-size: 1.05em !important;
    letter-spacing: .01em !important;
    border-radius: 8px !important;
}

/* ============================
   RESPONSIVE NOU DESIGN
   ============================ */

/* ---- Tablet (≤800px) ---- */
@media (max-width: 800px) {
    .cnp-form-section-sliders    { grid-template-columns: 1fr 1fr !important; gap: 24px 28px !important; }
    .cnp-form-section-secondary  { grid-template-columns: 1fr 1fr !important; gap: 20px 28px !important; }
    .cnp-pref-block              { min-width: 120px !important; }
    .cnp-form-section            { padding: 22px 24px !important; }
    .cnp-form-submit             { padding: 18px 24px !important; }
}

/* ---- Mobile (≤600px) ---- */
@media (max-width: 600px) {
    /* Card edge-to-edge */
    .cnp-form-card               { border-radius: 0 !important; border-left: none !important; border-right: none !important; }

    /* Sectiuni fara padding lateral */
    .cnp-form-section            { padding: 20px 16px !important; }
    .cnp-form-submit             { padding: 16px !important; }

    /* Titlu */
    .cnp-titlu                   { padding: 18px 16px 0 !important; margin-bottom: 12px !important; font-size: 1.35em !important; }

    /* Sliders: 1 coloana */
    .cnp-form-section-sliders    { grid-template-columns: 1fr !important; gap: 22px 0 !important; }

    /* Campuri secundare: 1 coloana */
    .cnp-form-section-secondary  { grid-template-columns: 1fr !important; gap: 18px 0 !important; }

    /* Preferinte: 2 pe rand */
    .cnp-form-section-prefs      { gap: 14px 16px !important; padding-top: 18px !important; padding-bottom: 18px !important; }
    .cnp-pref-block              { flex: 0 0 calc(50% - 8px) !important; min-width: 0 !important; }
}