/* RoCarvio: lizibilitate și afișare responsive, încărcat ultimul pe toate paginile. */
:root {
  --rc-copy-size: clamp(13px, calc(12.25px + .12vw), 15px);
  --rc-support-size: clamp(12px, calc(11.5px + .08vw), 13px);
  --rc-control-size: clamp(13px, calc(12.5px + .08vw), 14px);
  --rc-line-height: 1.68;
}

html {
  max-width: 100%;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  max-width: 100%;
  min-width: 320px;
  overflow-x: hidden;
  font-family: Poppins, Arial, sans-serif;
  font-size: var(--rc-text-lg);
  line-height: 1.55;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body :where(p, li) {
  font-size: var(--rc-copy-size) !important;
  line-height: var(--rc-line-height) !important;
}

body small {
  font-size: var(--rc-support-size) !important;
  line-height: var(--rc-leading-loose) !important;
}

img, picture, video, canvas, iframe {
  max-width: 100%;
}

main :where(p, li),
.admin-app :where(p, li),
.dealer-plan-modal-card :where(p, li),
.cookie-banner :where(p, li),
.cookie-modal-card :where(p, li) {
  font-size: var(--rc-copy-size) !important;
  line-height: var(--rc-line-height) !important;
}

main :where(small),
footer :where(p, a, small),
.admin-app small,
.cookie-banner a,
.cookie-modal-card small {
  font-size: var(--rc-support-size) !important;
  line-height: var(--rc-leading-loose) !important;
}

footer {
  font-size: var(--rc-support-size) !important;
  line-height: 1.65;
}

main :where(p, li, small, a, button, label, th, td),
.admin-app :where(p, small, a, button, label, th, td),
.dealer-plan-modal-card :where(p, li, span, button),
.cookie-banner :where(p, a, button),
.cookie-modal-card :where(p, small, label, button) {
  overflow-wrap: anywhere;
}

main :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea),
.admin-app :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  max-width: 100%;
  font-size: var(--rc-control-size) !important;
  line-height: var(--rc-leading-normal);
}

main :where(label, legend),
.admin-app :where(label, legend) {
  font-size: var(--rc-support-size);
  line-height: var(--rc-leading-relaxed);
}

.hero :where(p),
.plans-hero p,
.about-hero p,
.contact-hero p,
.valuation-hero p,
.safety-hero p {
  font-size: clamp(15px, calc(13.5px + .28vw), 18px) !important;
  line-height: 1.75 !important;
}

main h1 {
  line-height: 1.12;
  text-wrap: balance;
}

main :where(h2, h3) {
  line-height: 1.25;
  text-wrap: balance;
}

/* Informațiile scurte rămân compacte, dar nu microscopice. */
:where([class*="eyebrow"], [class*="kicker"], [class*="published-at"], [class*="feedback"], [class*="disclaimer"]) {
  font-size: var(--rc-support-size) !important;
  line-height: 1.55 !important;
}

.auth-showcase > div > span,
.auth-divider span,
.toggle-password,
.forgot-password,
.seller-public-hero > div:nth-child(2) > span,
.seller-public-section .section-title span,
.recently-viewed .section-title > div > span,
.account-heading > span,
.hero-points b,
.detail-badge,
.badge,
.dealer-card-owner,
.detail-report-button {
  font-size: var(--rc-support-size) !important;
  line-height: var(--rc-leading-relaxed) !important;
}

body .dealer-card-owner,
body .cards .card-content .specs span,
body .listing-seller-mini b,
body .safety-home-banner span,
body .safety-hero span,
body .safety-warning span,
body .safety-guide-heading span,
body .safety-report span,
body .favorites-count {
  font-size: var(--rc-support-size) !important;
}

body .detail-specs span,
body .safety-home-banner a,
body.about-page main span {
  font-size: var(--rc-support-size) !important;
}

.dealer-public-plans :where(a, span, em, b),
.dealer-account-plans :where(a, span, em, b) {
  font-size: var(--rc-support-size) !important;
}

.legal-main :where(a, span, code),
.contact-page main :where(a, span, b),
.valuation-page main :where(a, span, button),
.safety-page main :where(a, span),
.reset-main :where(a, span, .auth-local-badge),
.detail-breadcrumb :where(a, span, strong),
.detail-main-image > span {
  font-size: var(--rc-support-size) !important;
  line-height: 1.55 !important;
}

.toggle-password,
.forgot-password {
  min-height: 38px;
}

/* Cookie-urile trebuie să poată fi citite și apăsate fără efort. */
.cookie-banner-copy p,
.cookie-banner-copy a,
.cookie-banner-actions button,
.cookie-modal-card > p,
.cookie-modal-card label small,
.cookie-save {
  font-size: var(--rc-support-size) !important;
}

.cookie-banner-actions button,
.cookie-save {
  min-height: 44px;
}

/* Planuri dealer și explicațiile CRM / CSV. */
.plan-grid li,
.plan-copy,
.comparison :where(th, td, p),
.crm-story :where(p),
.trust-note,
.terms-note,
.dealer-plan-modal-card :where(p, li),
.dealer-plan-details-button,
.dealer-plan-modal-actions button {
  font-size: var(--rc-copy-size) !important;
}

.price :where(small, em, del),
.ribbon,
.crm-story-heading > span,
.crm-story-steps b,
.dealer-plan-modal-eyebrow,
.dealer-plan-modal-price span,
.dealer-plan-modal-note {
  font-size: var(--rc-support-size) !important;
}

/* Panoul dealer: câmpuri, ghid, CRM și branding. */
.dealer-leads :where(p, small, label > span, .lead-card-meta span, .lead-card-meta a, .lead-card-followup, .lead-empty),
.dealer-branding :where(p, small, label > span),
.dealer-account-plans :where(p, li, small) {
  font-size: var(--rc-support-size) !important;
  line-height: 1.62 !important;
}

.dealer-leads :where(input, select, textarea, button),
.dealer-branding :where(input, select, textarea, button) {
  font-size: var(--rc-control-size) !important;
}

/* Panoul administratorului păstrează densitatea, fără text sub 11–12 px. */
.admin-sidebar nav button,
.admin-signout,
.admin-topbar > a,
.panel-heading :where(button, select),
.table-action,
.admin-search,
.user-plan-select,
.dealer-admin-controls select {
  font-size: var(--rc-control-size) !important;
}

.admin-app :where(th, .badge, .admin-kicker, .admin-topbar p, .panel-heading p, .dealer-verified-toggle) {
  font-size: var(--rc-support-size) !important;
}

.admin-app td,
.request-card p {
  font-size: var(--rc-copy-size) !important;
}

/* Chatbotul rămâne discret, dar textul este lizibil. */
.rocarvio-chatbot :where(p, a, button, small, .chatbot-message, .chatbot-disclaimer) {
  font-size: var(--rc-support-size) !important;
  line-height: 1.55 !important;
}

.table-wrap,
.dealer-leads-board,
.chatbot-quick-actions {
  max-width: 100%;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}

pre, code {
  max-width: 100%;
  overflow-x: auto;
}

@media (pointer: coarse) {
  button,
  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea,
  [role="button"] {
    min-height: 44px;
    touch-action: manipulation;
  }
}

@media (min-width: 769px) and (max-width: 1180px) {
  main :where(p, li),
  .admin-app :where(p, li),
  .dealer-plan-modal-card :where(p, li) {
    font-size: 13.5px !important;
  }

  .plan-grid article {
    padding: clamp(22px, 3vw, 30px);
  }
}

@media (max-width: 768px) {
  body {
    min-width: 0;
    font-size: var(--rc-text-md);
  }

  main h1 {
    font-size: clamp(28px, 8vw, 42px) !important;
  }

  main h2 {
    font-size: clamp(22px, 6.2vw, 32px) !important;
  }

  main h3 {
    font-size: clamp(17px, 4.7vw, 23px) !important;
  }

  main :where(p, li),
  .admin-app :where(p, li),
  .dealer-plan-modal-card :where(p, li),
  .cookie-banner :where(p, li),
  .cookie-modal-card :where(p, li) {
    font-size: var(--rc-text-body) !important;
  }

  main :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea),
  .admin-app :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea),
  .dealer-leads :where(input, select, textarea),
  .dealer-branding :where(input, select, textarea) {
    font-size: var(--rc-text-base) !important;
  }

  .dealer-plan-modal-card,
  .cookie-modal-card {
    max-width: calc(100vw - 20px);
    max-height: calc(100vh - 20px);
    max-height: calc(100dvh - 20px);
  }

  .cookie-banner {
    max-height: calc(100vh - 20px);
    max-height: calc(100dvh - 20px);
    overflow-y: auto;
  }

  table {
    font-variant-numeric: tabular-nums;
  }
}

@media (max-width: 430px) {
  :root {
    --rc-copy-size: 13px;
    --rc-support-size: 12px;
  }

  .dealer-plan-modal-card,
  .cookie-modal-card {
    border-radius: 14px;
  }

  .dealer-plan-modal-price {
    align-items: flex-start;
    flex-direction: column;
  }
}


@media (max-width:768px){
  body.compare-page-body{
    min-width:0 !important;
    width:100%;
    overflow-x:hidden !important;
  }
  .compare-page{
    width:100%;
    min-width:0 !important;
    overflow:hidden !important;
  }
  .compare-hero{
    width:100%;
    padding:var(--rc-space-14) var(--rc-space-7) 78px !important;
    overflow:hidden;
  }
  .compare-hero h1{
    max-width:100%;
    margin-inline:auto;
    font-size:clamp(29px,8.5vw,38px)!important;
    line-height:1.14 !important;
  }
  .compare-hero > p:last-child{
    max-width:520px;
    margin-inline:auto;
    font-size:var(--rc-text-md) !important;
    line-height:1.65!important;
  }
  .compare-container{
    width:calc(100% - 24px)!important;
    max-width:none !important;
    min-width:0 !important;
    margin:-42px auto 0 !important;
    overflow:visible !important;
  }
  .compare-grid{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    overflow:hidden!important;
    border-radius:16px!important;
  }
  .compare-section-title,
  .compare-cars-row,
  .compare-label{
    grid-column:1 / -1!important;
  }
  .compare-section-title{
    min-width:0!important;
    padding:var(--rc-space-6) var(--rc-space-5)!important;
    align-items:center!important;
    justify-content:center!important;
    flex-direction:column!important;
    gap:5px!important;
    text-align:center!important;
  }
  .compare-cars-title{
    min-height:70px!important;
  }
  .compare-section-title span{
    font-size:var(--rc-text-2xs) !important;
    letter-spacing:1.3px!important;
  }
  .compare-section-title strong{
    max-width:100%;
    font-size:var(--rc-text-base) !important;
    line-height:1.25!important;
  }
  .compare-cars-row{
    width:100%;
    min-width:0!important;
    padding:var(--rc-space-3)!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:var(--rc-space-3)!important;
  }
  .compare-cars-row .compare-car-head{
    width:100%;
    min-width:0!important;
    padding:7px!important;
    border-radius:11px!important;
    overflow:hidden;
  }
  .compare-cars-row .compare-car-head img{
    width:100%!important;
    height:auto!important;
    aspect-ratio:16/10!important;
    margin:0 0 var(--rc-space-3)!important;
    object-fit:cover!important;
    border-radius:8px!important;
  }
  .compare-car-head h2{
    width:100%;
    min-height:42px!important;
    margin:0!important;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:clamp(12px,3.7vw,15px)!important;
    line-height:1.25!important;
    text-align:center;
    overflow-wrap:anywhere;
  }
  .compare-car-head strong{
    width:100%;
    min-width:0;
    min-height:36px!important;
    margin-top:7px!important;
    padding:7px var(--rc-space-1)!important;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:clamp(12px,3.7vw,15px)!important;
    line-height:1.25!important;
    text-align:center;
    overflow-wrap:anywhere;
  }
  .compare-label{
    width:100%;
    min-width:0!important;
    min-height:auto!important;
    padding:var(--rc-space-4) var(--rc-space-5)!important;
    border-right:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    background:#171717!important;
    text-align:center!important;
  }
  .compare-label span{
    padding-left:0!important;
    font-size:var(--rc-text-sm) !important;
    line-height:1.35!important;
  }
  .compare-label span::before{
    display:none!important;
  }
  .compare-value{
    width:100%;
    min-width:0!important;
    min-height:50px!important;
    padding:var(--rc-space-4) 5px!important;
    border-left:1px solid rgba(255,255,255,.075)!important;
    text-align:center!important;
    overflow:hidden;
  }
  .compare-value > strong{
    max-width:100%;
    font-size:clamp(10px,3vw,12px)!important;
    line-height:1.35!important;
    text-align:center!important;
    overflow-wrap:anywhere;
  }
  .compare-equipment{
    min-height:0!important;
    padding:7px!important;
    align-items:flex-start!important;
  }
  .compare-equipment ul{
    width:100%;
    gap:5px!important;
  }
  .compare-equipment li{
    width:100%;
    min-height:0!important;
    padding:7px var(--rc-space-1)!important;
    font-size:9.5px!important;
    line-height:1.35!important;
    overflow-wrap:anywhere;
  }
  .compare-page-actions{
    width:100%;
    padding:var(--rc-space-5) !important;
    gap:var(--rc-space-4) !important;
  }
  .compare-page-actions > *{
    width:100%!important;
  }

  footer .footer-grid{
    text-align:left !important;
  }
  footer .footer-grid h3::after{
    left:0!important;
    transform:none!important;
  }
  footer .footer-grid a:not(.footer-contact-row){
    margin-left:0 !important;
    margin-right:0 !important;
  }
  .rocarvio-chatbot:not(.open){
    right:10px !important;
    bottom:12px!important;
  }
  .rocarvio-chatbot:not(.open) .chatbot-launcher{
    height:48px!important;
    padding:var(--rc-space-1) 13px var(--rc-space-1) 5px !important;
    gap:7px !important;
    border-radius:25px!important;
  }
  .rocarvio-chatbot:not(.open) .chatbot-launcher img{
    width:38px!important;
    height:38px!important;
  }
  .rocarvio-chatbot:not(.open) .chatbot-launcher span{
    font-size:var(--rc-text-sm) !important;
  }
  footer .copyright,
  footer .footer-bottom{
    width:100%;
    padding-left:var(--rc-space-3);
    padding-right:var(--rc-space-3);
    overflow-wrap:anywhere;
  }
}

@media (max-width:390px){
  .compare-container{
    width:calc(100% - 16px)!important;
  }
  .compare-cars-row{
    padding:var(--rc-space-2)!important;
    gap:var(--rc-space-2)!important;
  }
  .compare-cars-row .compare-car-head{
    padding:var(--rc-space-2)!important;
  }
  .compare-section-title strong{
    font-size:var(--rc-text-lg) !important;
  }
}

