/*
 * TBI Payment Gateway — Frontend CSS
 * Brand colors from TBI Marketing Guidelines:
 *   Orange:     #FF6600  (primary action)
 *   Black:      #0D0D0D  (primary text / header)
 *   White:      #FFFFFF
 *   Grey light: #F4F4F4
 *   Grey dark:  #E1E1E1
 *   Black 90%:  #252525
 *   Black 80%:  #3D3D3D
 */
:root {
    --tbi-orange:      #FF6600;
    --tbi-orange-dark: #e55a00;
    --tbi-black:       #0D0D0D;
    --tbi-black-90:    #252525;
    --tbi-black-80:    #3D3D3D;
    --tbi-grey-light:  #F4F4F4;
    --tbi-grey-dark:   #E1E1E1;
    --tbi-white:       #FFFFFF;
    --tbi-radius:      8px;
    --tbi-shadow:      0 2px 16px rgba(13,13,13,.10);
}

/* ---- Full-page layout (payment link standalone page) ---- */
body.tbi-payment-page {
    margin: 0;
    background: var(--tbi-grey-light);
    color: var(--tbi-black);
    /* font-family intentionally omitted — inherits from the WordPress theme */
}
.tbi-page-wrap    { min-height: 100vh; display: flex; flex-direction: column; }
.tbi-page-header  {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 24px; background: var(--tbi-black); border-bottom: 3px solid var(--tbi-orange);
}
.tbi-page-logo    { display: flex; align-items: center; gap: 8px; text-decoration: none; }
.tbi-site-name    { font-size: 16px; font-weight: 700; color: var(--tbi-white); }
.tbi-header-lock  { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #aaa; }
.tbi-page-main    { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 32px 16px; }
.tbi-card         { background: var(--tbi-white); border-radius: var(--tbi-radius); box-shadow: var(--tbi-shadow); padding: 32px; width: 100%; max-width: 600px; }
.tbi-powered-by   { margin-top: 16px; font-size: 12px; color: #888; text-align: center; }
.tbi-powered-by strong { color: var(--tbi-black-80); }

/* ---- Form header with TBI logo ---- */
.tbi-wrap         { max-width: 600px; margin: 0 auto; }
.tbi-form-header  { margin-bottom: 24px; }
.tbi-form-logo    { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }
.tbi-form-logo-divider { width: 1px; height: 22px; background: #d1d5db; flex-shrink: 0; }
.tbi-form-tagline { font-size: 14px; font-weight: 600; color: var(--tbi-black); letter-spacing: -0.01em; }
.tbi-form-logo-text {
    font-size: 18px; font-weight: 700; color: var(--tbi-black);
    letter-spacing: -0.02em;
}
.tbi-form-title   { margin: 0 0 6px; font-size: 20px; font-weight: 700; color: var(--tbi-black); }
.tbi-form-desc    { margin: 0; color: var(--tbi-black-80); font-size: 14px; line-height: 1.5; }

/* ---- Fieldsets ---- */
.tbi-fieldset {
    border: 1.5px solid var(--tbi-grey-dark);
    border-radius: var(--tbi-radius);
    padding: 16px 20px 20px;
    margin: 0 0 16px;
    background: var(--tbi-white);
}
.tbi-fieldset legend {
    font-size: 11px; font-weight: 700; text-transform: uppercase;
    letter-spacing: .08em; color: var(--tbi-black-80);
    padding: 0 6px; background: var(--tbi-white);
}

/* ---- Fields ---- */
.tbi-row          { display: flex; gap: 12px; margin-top: 12px; flex-wrap: wrap; }
.tbi-two-col .tbi-field,
.tbi-three-col .tbi-field { flex: 1; min-width: 140px; }
.tbi-field        { display: flex; flex-direction: column; flex: 1; }
.tbi-field--sm    { flex: 0 0 80px; min-width: 0 !important; }
.tbi-field--grow  { flex: 2; }
.tbi-field--amount { max-width: 220px; }
.tbi-field label  { font-size: 13px; font-weight: 600; color: var(--tbi-black); margin-bottom: 5px; }
.tbi-field .tbi-req   { color: var(--tbi-orange); }
.tbi-field input  {
    padding: 10px 12px; border: 1.5px solid var(--tbi-grey-dark);
    border-radius: 6px; font-size: 14px; outline: none; background: var(--tbi-white);
    color: var(--tbi-black); transition: border-color .15s, box-shadow .15s;
}
.tbi-field input::placeholder { color: #aaa; }
.tbi-field input:focus {
    border-color: var(--tbi-orange);
    box-shadow: 0 0 0 3px rgba(255,102,0,.12);
}
.tbi-field input[readonly] { background: var(--tbi-grey-light); cursor: not-allowed; color: var(--tbi-black-80); }
.tbi-field-hint   { margin: 5px 0 0; font-size: 11px; color: #888; }

/* ---- Amount ---- */
.tbi-amount-wrap  { position: relative; display: flex; align-items: center; }
.tbi-currency     { position: absolute; left: 12px; font-weight: 700; color: var(--tbi-orange); pointer-events: none; font-size: 15px; }
.tbi-amount-wrap input { padding-left: 28px; width: 100%; }
/* Locked (fixed / URL) amount — plain text, no input chrome */
.tbi-amount-fixed { font-size: 26px; font-weight: 700; color: var(--tbi-black); line-height: 1.2; padding: 2px 0; }

/* ---- Submit button — TBI orange ---- */
.tbi-submit-row   { margin-top: 20px; }
.tbi-wrap .tbi-btn,
.tbi-card .tbi-btn {
    display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 10px !important;
    padding: 12px 24px !important; border: none !important; border-radius: 6px !important;
    font-size: 14px !important; font-weight: 700 !important; cursor: pointer !important;
    transition: background .15s, transform .1s;
    width: 100% !important; letter-spacing: .01em !important;
    text-transform: none !important; line-height: normal !important;
}
.tbi-btn-logo {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    /* sidebar variant already has white paths + transparent bg — no filter needed */
}
.tbi-btn-logo svg { width: 22px; height: 22px; }
.tbi-wrap .tbi-btn--primary,
.tbi-card .tbi-btn--primary { background: var(--tbi-orange) !important; background-color: var(--tbi-orange) !important; color: var(--tbi-white) !important; }
.tbi-wrap .tbi-btn--primary:hover,
.tbi-card .tbi-btn--primary:hover   { background: var(--tbi-orange-dark) !important; background-color: var(--tbi-orange-dark) !important; }
.tbi-wrap .tbi-btn--primary:active,
.tbi-card .tbi-btn--primary:active  { transform: scale(.98); }
.tbi-wrap .tbi-btn--primary:disabled,
.tbi-card .tbi-btn--primary:disabled { opacity: .6; cursor: not-allowed; }
.tbi-btn-spinner {
    width: 18px; height: 18px; border: 2.5px solid rgba(255,255,255,.35);
    border-top-color: var(--tbi-white); border-radius: 50%;
    animation: tbi-spin .65s linear infinite;
}
@keyframes tbi-spin { to { transform: rotate(360deg); } }

/* ---- BNPL info badges ---- */
.tbi-bnpl-info {
    display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; justify-content: center;
}
.tbi-bnpl-badge {
    display: inline-flex; align-items: center; gap: 5px;
    background: var(--tbi-grey-light); border: 1px solid var(--tbi-grey-dark);
    border-radius: 20px; padding: 5px 12px; font-size: 12px; font-weight: 600;
    color: var(--tbi-black-80);
}
.tbi-bnpl-badge svg { stroke: var(--tbi-orange); flex-shrink: 0; }

/* ---- Secure note ---- */
.tbi-secure-note {
    display: flex; align-items: center; justify-content: center;
    gap: 6px; font-size: 12px; color: #999; margin-top: 14px; text-align: center;
}
.tbi-secure-note svg { stroke: #bbb; flex-shrink: 0; }
.tbi-secure-note strong { color: var(--tbi-black); }

/* ---- Notices ---- */
.tbi-notice {
    padding: 12px 16px; border-radius: 6px; margin-bottom: 16px;
    font-size: 14px; line-height: 1.5;
}
.tbi-notice--error   { background: #fff1f0; border: 1.5px solid #ffd0c8; color: #b91c1c; }
.tbi-notice--success { background: #f0fdf4; border: 1.5px solid #bbf7d0; color: #166534; }

/* ---- Customer status page ---- */
.tbi-status-wrap   { max-width: 600px; margin: 24px auto; padding: 0 16px; }
.tbi-status-card   {
    border-radius: var(--tbi-radius); padding: 32px;
    background: var(--tbi-white); box-shadow: var(--tbi-shadow);
    border-top: 4px solid var(--tbi-grey-dark);
}
.tbi-status-card--success { border-top-color: #16a34a; }
.tbi-status-card--error   { border-top-color: #dc2626; }
.tbi-status-card--warning { border-top-color: var(--tbi-orange); }
.tbi-status-card--info    { border-top-color: var(--tbi-orange); }
.tbi-status-card--pending { border-top-color: var(--tbi-black-80); }
.tbi-status-icon   { text-align: center; margin-bottom: 12px; }
.tbi-status-icon svg { width: 52px; height: 52px; }
.tbi-status-card--success .tbi-status-icon svg { stroke: #16a34a; }
.tbi-status-card--error   .tbi-status-icon svg { stroke: #dc2626; }
.tbi-status-card--warning .tbi-status-icon svg,
.tbi-status-card--info    .tbi-status-icon svg { stroke: var(--tbi-orange); }
.tbi-status-card--pending .tbi-status-icon svg { stroke: var(--tbi-black-80); }
.tbi-status-heading  { text-align: center; margin: 0 0 12px; font-size: 22px; color: var(--tbi-black); }
.tbi-status-message  { text-align: center; color: var(--tbi-black-80); line-height: 1.6; margin: 0 0 20px; }
.tbi-status-details  { background: var(--tbi-grey-light); border-radius: 6px; padding: 16px 20px; margin-bottom: 16px; }
.tbi-status-details h3 {
    margin: 0 0 12px; font-size: 11px; text-transform: uppercase;
    letter-spacing: .08em; color: #888;
}
.tbi-detail-list   { display: grid; grid-template-columns: 160px 1fr; gap: 7px 12px; margin: 0; }
.tbi-detail-list dt { font-size: 13px; color: #888; font-weight: 600; }
.tbi-detail-list dd { font-size: 13px; color: var(--tbi-black); margin: 0; }
.tbi-status-pill   { display: inline-block; padding: 2px 10px; border-radius: 20px; font-size: 12px; font-weight: 700; }
.tbi-status-pill--success { background: #dcfce7; color: #166534; }
.tbi-status-pill--error   { background: #fee2e2; color: #991b1b; }
.tbi-status-pill--warning,
.tbi-status-pill--info    { background: #fff1e6; color: #9a3300; }
.tbi-status-pill--pending { background: var(--tbi-grey-light); color: var(--tbi-black-80); }
.tbi-status-help   { text-align: center; font-size: 13px; color: #aaa; margin: 12px 0 0; }
.tbi-status-help a { color: var(--tbi-orange); }

/* ---- Responsive ---- */
@media (max-width: 520px) {
    .tbi-card { padding: 20px; }
    .tbi-two-col .tbi-field,
    .tbi-three-col .tbi-field { min-width: 100%; flex: unset; }
    .tbi-field--sm  { flex: 1; }
    .tbi-detail-list { grid-template-columns: 1fr; }
    .tbi-detail-list dt { margin-top: 6px; }
}

/* ---- Status page brand header ---- */
.tbi-status-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-bottom: 20px;
}
.tbi-status-brand svg { flex-shrink: 0; }
.tbi-status-brand-text {
    font-size: 18px;
    font-weight: 700;
    color: var(--tbi-black);
}

/* ---- Powered-by footer ---- */
.tbi-powered-by {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 16px;
    font-size: 12px;
    color: #888;
}
.tbi-powered-by svg { flex-shrink: 0; }
/* =========================================================================
   tbi Instalment Calculator Widget
   Matches the design from Calculator_GR_20251206.pdf
========================================================================= */

.tbi-inst-widget {
    margin: 14px 0 0;
    font-size: 14px;
}

/* Label above dropdown */
.tbi-inst-label {
    display: block;
    font-size: 13px;
    color: #6b7280;
    margin-bottom: 6px;
    font-weight: 400;
}

/* Dropdown */
.tbi-inst-select-wrap {
    position: relative;
    margin-bottom: 10px;
}
.tbi-inst-select-wrap select {
    width: 100%;
    padding: 11px 36px 11px 14px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    background: #fff;
    color: #0D0D0D;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    transition: border-color .15s;
}
.tbi-inst-select-wrap select:focus {
    outline: none;
    border-color: #FF6600;
    box-shadow: 0 0 0 3px rgba(255,102,0,.1);
}
.tbi-inst-select-wrap::after {
    content: '';
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    border: 5px solid transparent;
    border-top-color: #6b7280;
    margin-top: 3px;
    pointer-events: none;
}

/* Plan card — main row matching PDF */
.tbi-plan-card {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 12px 14px 10px;
    display: grid;
    grid-template-columns: auto auto 1fr auto;
    grid-template-rows: auto auto;
    align-items: center;
    gap: 0 10px;
    background: #fff;
    position: relative;
}

/* Logo + "bank" */
.tbi-plan-card-logo {
    display: flex;
    align-items: center;
    gap: 4px;
    grid-column: 1;
    grid-row: 1;
}
.tbi-plan-card-bankname {
    font-size: 13px;
    font-weight: 700;
    color: #0D0D0D;
}

/* ⓘ info button */
.tbi-card .tbi-plan-info-btn,
.tbi-wrap .tbi-plan-info-btn {
    grid-column: 2 !important;
    grid-row: 1 !important;
    background: none !important;
    background-color: transparent !important;
    border: none !important;
    cursor: pointer !important;
    color: #9ca3af !important;
    font-size: 16px !important;
    padding: 0 !important;
    line-height: 1 !important;
    align-self: center !important;
    user-select: none !important;
    -webkit-user-select: none !important;
    border-radius: 0 !important;
    text-transform: none !important;
    font-weight: normal !important;
}
.tbi-plan-info-btn:hover                  { color: #034694; }
.tbi-plan-info-btn:focus                  { outline: none; box-shadow: none; background: white !important; }
.tbi-plan-info-btn:focus-visible          { outline: none; box-shadow: none; background: white !important; }
.tbi-plan-info-btn:focus:not(:focus-visible) { outline: none; background: white !important; }
.tbi-plan-info-btn:-moz-focusring        { outline: none; background: white !important; }

/* Centre column: rate + "Τι θα πληρώνω" */
.tbi-plan-card-center {
    grid-column: 3;
    grid-row: 1;
    min-width: 0;
}
.tbi-plan-rate {
    font-size: 13px;
    font-weight: 700;
    color: #0D0D0D;
    line-height: 1.2;
}

/* Right column: monthly amount + Επιλογή button */
.tbi-plan-card-right {
    grid-column: 4;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 5px;
}
.tbi-plan-monthly {
    font-size: 15px;
    font-weight: 700;
    color: #0D0D0D;
    white-space: nowrap;
}

/* "Τι θα πληρώνω" toggle — looks like a plain link, no browser button chrome */
/* Higher specificity than theme's bare 'button' rule */
.tbi-plan-detail-toggle {
  appearance: none;
  -webkit-appearance: none;
  background: white !important;
  border: none;
  border-radius: 0;
  box-shadow: none;
  outline: none;
  padding: 0;
  margin: 2px 0 0;
  cursor: pointer;
  font-size: 12px;
  font-weight: 400;
  color: #2563eb !important;
  text-decoration: underline;
  text-underline-offset: 2px;
  text-transform: none;
  letter-spacing: normal;
  display: block;
  line-height: 1.4;
  -webkit-tap-highlight-color: transparent;
}
.tbi-plan-detail-toggle:hover { color: #1d4ed8; }
.tbi-card .tbi-plan-detail-toggle:focus,
.tbi-card .tbi-plan-detail-toggle:focus-visible,
.tbi-card .tbi-plan-detail-toggle:focus:not(:focus-visible),
.tbi-card .tbi-plan-detail-toggle:-moz-focusring { outline: none !important; box-shadow: none !important; background: white !important; color: #1d4ed8; }
.tbi-card .tbi-plan-detail-toggle:active { color: #1e40af; background: white !important; }
.tbi-plan-detail-toggle::selection      { background: white !important; color: inherit; }
.tbi-plan-detail-toggle::-moz-selection { background: white !important; color: inherit; }

/* Επιλογή button — outlined, matching PDF */
.tbi-card .tbi-plan-choose-btn,
.tbi-wrap .tbi-plan-choose-btn {
    border: 1.5px solid #0D0D0D !important;
    background: #fff !important;
    background-color: #fff !important;
    color: #0D0D0D !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 5px 16px !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    transition: background .15s, color .15s;
    text-transform: none !important;
    line-height: normal !important;
}
.tbi-card .tbi-plan-choose-btn:hover,
.tbi-wrap .tbi-plan-choose-btn:hover,
.tbi-card .tbi-plan-choose-btn--selected,
.tbi-wrap .tbi-plan-choose-btn--selected {
    background: #0D0D0D !important;
    background-color: #0D0D0D !important;
    color: #fff !important;
}

/* Insurance row — full width, below the main row */
.tbi-plan-insurance-row {
    grid-column: 1 / -1;
    grid-row: 2;
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    color: #6b7280;
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid #f3f4f6;
}
.tbi-plan-insurance-row svg { stroke: #16a34a; flex-shrink: 0; width: 12px; height: 12px; }

/* ---- Detail panel ---- */
.tbi-plan-detail {
    border: 1px solid #e5e7eb;
    border-top: none;
    border-radius: 0 0 10px 10px;
    padding: 14px 16px;
    background: #fafafa;
    margin-top: -4px;
    font-size: 13px;
}
.tbi-plan-section { margin-bottom: 12px; }

.tbi-plan-heading {
    font-weight: 700;
    font-size: 13px;
    color: #0D0D0D;
    margin-bottom: 8px;
}

/* Instalment breakdown rows (interest-free) */
.tbi-plan-row {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 4px 0;
}
.tbi-plan-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #2563eb;
    flex-shrink: 0;
    margin-top: 3px;
}
.tbi-plan-row-body { flex: 1; }
.tbi-plan-row-amount { display: block; font-weight: 500; color: #0D0D0D; }
.tbi-plan-row-sub    { display: block; font-size: 11px; color: #9ca3af; margin-top: 1px; }

/* Cost of service row */
.tbi-plan-cost-row {
    display: flex;
    justify-content: space-between;
    padding: 8px 0 0;
    border-top: 1px solid #e5e7eb;
    margin-top: 8px;
    font-size: 12px;
    color: #6b7280;
}
.tbi-plan-cost-row strong { color: #0D0D0D; }

/* Interest plan items */
.tbi-plan-item {
    padding: 6px 0;
    border-bottom: 1px dotted #e5e7eb;
}
.tbi-plan-item:last-child { border-bottom: none; }
.tbi-plan-item-label { font-size: 12px; color: #6b7280; margin-bottom: 1px; }
.tbi-plan-item-value { font-size: 13px; color: #0D0D0D; }
.tbi-plan-item-note  { font-size: 11px; color: #9ca3af; margin-top: 1px; }
.tbi-plan-highlight  { color: #FF6600; font-size: 15px; }

.tbi-plan-divider {
    border: none;
    border-top: 1px solid #e5e7eb;
    margin: 8px 0;
}
.tbi-plan-note {
    font-size: 11px;
    color: #9ca3af;
    margin: 0 0 8px;
    line-height: 1.4;
}

/* Indicative disclaimer — shown below card for ≥5 instalment plans */
.tbi-plan-card-disclaimer,
.tbi-plan-disclaimer {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 6px;
    padding: 10px 12px;
    font-size: 12px;
    line-height: 1.5;
    color: #78350f;
    margin-top: 8px;
}
.tbi-plan-card-disclaimer { border-top: none; border-radius: 0 0 10px 10px; margin-top: 0; }
.tbi-plan-disclaimer-icon { font-size: 14px; flex-shrink: 0; margin-top: 1px; }

/* Global Firefox focus suppression for all tbi checkout buttons */
.tbi-wrap button                           { user-select: none; -webkit-user-select: none; }
.tbi-wrap button::selection                { background: white !important; }
.tbi-wrap button::-moz-selection           { background: white !important; }
.tbi-wrap button:focus                     { outline: none !important; box-shadow: none !important; background: white !important; }
.tbi-wrap button:focus-visible             { outline: none !important; box-shadow: none !important; background: white !important; }
.tbi-wrap button:focus:not(:focus-visible) { outline: none !important; background: white !important; }
.tbi-wrap button:-moz-focusring            { outline: none !important; background: white !important; }

/* Repayment notice for interest plans */
.tbi-plan-notice {
    font-size: 11px;
    color: #6b7280;
    line-height: 1.5;
    margin-top: 10px;
    padding: 8px 10px;
    background: #f9fafb;
    border-radius: 6px;
    border-left: 3px solid #d1d5db;
}


/* ── Plan display (open-amount page) ──────────────────────────── */
/* Visibility wrapper only — the program cards carry the visible box. */
.tbi-plan-simple {
    display: none;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
}

/* Program options + selectable cards */
.tbi-plan-options {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.tbi-plan-card {
    border: 1.5px solid #e5e7eb;
    border-radius: 10px;
    padding: 12px 14px;
    background: #fff;
}
/* Single (non-selectable) breakdown sits inside the amount card — no inner box,
   just a divider separating it from the amount above. */
.tbi-inst-widget .tbi-plan-card:not(.tbi-plan-card--selectable) {
    border: none;
    border-top: 1.5px solid var(--tbi-grey-dark);
    border-radius: 0;
    padding: 16px 0 2px;
    background: transparent;
}
.tbi-plan-card--selectable {
    cursor: pointer;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.tbi-plan-card--selectable:hover { border-color: #9db6e0; }
.tbi-plan-card--selectable:focus-visible { outline: 2px solid #034694; outline-offset: 2px; }
.tbi-plan-card--selected {
    border-color: #034694;
    box-shadow: inset 0 0 0 1px #034694;
}
.tbi-plan-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
}
.tbi-plan-card-title {
    font-size: 14px;
    font-weight: 700;
    color: #0D0D0D;
    letter-spacing: -0.01em;
}
.tbi-plan-card-badge {
    font-size: 11px;
    font-weight: 600;
    color: #6b7280;
    background: #f3f4f6;
    padding: 2px 8px;
    border-radius: 999px;
    white-space: nowrap;
}
.tbi-plan-card-amounts {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}
.tbi-plan-card-amount-item {
    display: flex;
    flex-direction: column;
    gap: 1px;
}
.tbi-plan-card-amount-label {
    font-size: 11px;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.tbi-plan-card-monthly {
    font-size: 16px;
    font-weight: 700;
    color: #FF6600;
}
.tbi-plan-card-total {
    font-size: 14px;
    font-weight: 600;
    color: #374151;
}

/* Legacy single-row classes (kept for safety; no longer emitted) */
.tbi-plan-simple-amounts {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.tbi-plan-simple-amount-item {
    display: flex;
    flex-direction: column;
    gap: 1px;
}
.tbi-plan-simple-amount-label {
    font-size: 11px;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.tbi-plan-simple-monthly {
    font-size: 16px;
    font-weight: 700;
    color: #FF6600;
}
.tbi-plan-simple-total {
    font-size: 14px;
    font-weight: 600;
    color: #374151;
}
.tbi-plan-simple-sep {
    font-size: 18px;
    color: #d1d5db;
    align-self: flex-end;
    padding-bottom: 2px;
}

/* Notice */
.tbi-plan-simple-notice {
    font-size: 11px;
    color: #6b7280;
    line-height: 1.5;
}

.tbi-plan-simple--visible { display: flex !important; flex-direction: column; }