/* Settings as Pipedrive company settings (js/pd-settings.js): sticky section menu + one readable column.
   Loaded after css/pd-theme.css on settings.html only. */
.settings-columns.pds-on{ display:grid !important; grid-template-columns:232px minmax(0,1fr) !important; gap:0 !important; align-items:stretch !important; flex:1; min-height:0; margin-left:0 !important; margin-right:0 !important; }
.main:has(.pds-on){ gap:0 !important; }
.pds-nav{ border-right:1px solid rgba(33,35,44,.12); padding:16px 12px 24px; overflow-y:auto; background:#fff; }
.pds-nav-title{ font-size:20px; font-weight:600; color:#21232c; padding:0 8px 12px; }
.pds-nav-group{ font-size:12px; font-weight:600; color:#65686f; padding:14px 8px 6px; }
.pds-item{ width:100%; display:flex; align-items:center; gap:10px; height:34px; padding:0 8px; border:0; border-radius:4px; background:transparent; color:#21232c; font-size:14px; text-align:left; cursor:pointer; transition:background .15s; }
.pds-item i{ font-size:17px; color:#65686f; flex:none; }
.pds-item span{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pds-item:hover{ background:#f2f3f4; }
.pds-item.is-on{ background:#e9eaec; font-weight:600; } .pds-item.is-on i{ color:#21232c; }
.pds-content{ position:relative; overflow-y:auto; min-height:0; padding:8px 32px 40px; scroll-behavior:smooth; }
.pds-inner{ max-width:880px; margin:0 auto; display:flex; flex-direction:column; gap:16px; }
.pds-group{ font-size:20px; font-weight:600; color:#21232c; margin:16px 0 -4px; }
.pds-on .settings-col{ max-height:none !important; overflow:visible !important; padding-right:0 !important; gap:16px !important; }
/* cards */
.pds-on .panel, .pds-on .acc{ background:#fff !important; border:0 !important; border-radius:8px !important; overflow:hidden; box-shadow:0 1px 3px rgba(0,0,0,.07),0 0 1px rgba(0,0,0,.14) !important; }
.pds-on .panel-pad{ padding:20px 24px !important; }
.pds-on .panel-title{ font-size:16px !important; font-weight:600 !important; text-transform:none !important; letter-spacing:0 !important; color:#21232c !important; margin-bottom:16px !important; gap:10px !important; }
.pds-on .panel-title i, .pds-on .panel-title .aicon{ font-size:18px !important; color:#65686f !important; }
.pds-on .panel-title .hint{ font-size:12px !important; font-weight:450 !important; color:#65686f !important; }
/* profile card */
.pds-on .hero-cover{ height:180px !important; background:linear-gradient(120deg,#e9eaec,#f5f5f6 60%,#eef6f0) !important; }
.pds-on .hero-identity{ padding:0 24px 20px !important; }
.pds-on .hero-name{ font-size:25px !important; line-height:34px !important; font-weight:450 !important; color:#21232c !important; }
.pds-on .hero-mode{ font-size:11px !important; font-weight:600 !important; letter-spacing:.5px; border-radius:4px !important; background:#f0f1f3 !important; color:#21232c !important; border:0 !important; }
.pds-on .online-banner{ border-radius:8px !important; background:#f6f7f8 !important; border:0 !important; }
/* accordions = Pipedrive collapsible sections */
.pds-on .acc-head{ padding:16px 24px !important; gap:14px !important; }
.pds-on .acc-head:hover{ background:#fafafa !important; }
.pds-on .acc-icon{ width:36px !important; height:36px !important; border-radius:8px !important; background:#f2f3f4 !important; border:0 !important; box-shadow:none !important; color:#21232c !important; }
.pds-on .acc-icon i, .pds-on .acc-icon .aicon{ font-size:18px !important; }
.pds-on .acc-title{ font-size:16px !important; font-weight:600 !important; color:#21232c !important; }
.pds-on .acc-sub{ font-size:12px !important; color:#65686f !important; margin-top:2px !important; }
.pds-on .acc.open .acc-head{ border-bottom:1px solid rgba(33,35,44,.08); }
.pds-on .acc-inner-pad{ padding:16px 24px 20px !important; }
/* fields */
.pds-on .field label{ font-size:13px !important; font-weight:600 !important; text-transform:none !important; letter-spacing:0 !important; color:#21232c !important; }
.pds-on .field.locked input{ background:#f6f7f8 !important; color:#65686f !important; }
.pds-on .gallery-grid > *{ border-radius:8px !important; overflow:hidden; }
.pds-on .viz{ padding:20px 24px !important; }
/* the save bar floats at the bottom of the column */
.pds-content > .save-bar{ position:sticky !important; bottom:16px; max-width:880px; margin:16px auto 0 !important; border-radius:8px !important; box-shadow:0 8px 24px rgba(0,0,0,.18) !important; }
@media (max-width:1024px){
  .settings-columns.pds-on{ display:block !important; }
  .pds-nav{ display:none; }
  .pds-content{ padding:8px 0 32px; overflow:visible; }
}

/* ===== Pipedrive "Billing" look (2026-10-22): wide column + right rail, uppercase section labels, banner, add-ons ===== */
.pds-wrap{ display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:20px; max-width:1140px; margin:0 auto; align-items:start; }
.pds-wrap .pds-inner{ max-width:none; margin:0; }
.pds-rail{ position:sticky; top:8px; display:flex; flex-direction:column; gap:16px; padding-top:16px; }
.pds-rcard{ background:#fff; border-radius:8px; box-shadow:0 1px 3px rgba(0,0,0,.07),0 0 1px rgba(0,0,0,.14); padding:20px 22px; }
.pds-rh{ font-size:11.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:#3d4049; margin-bottom:12px; }
.pds-str{ display:flex; align-items:baseline; gap:8px; } .pds-str b{ font-size:26px; font-weight:600; color:#21232c; } .pds-str span{ font-size:13px; color:#65686f; }
.pds-bar{ height:8px; border-radius:4px; background:#eef0f2; margin:8px 0 12px; overflow:hidden; } .pds-bar i{ display:block; height:100%; background:#1f9254; border-radius:4px; transition:width .5s; }
.pds-steps{ display:flex; flex-direction:column; }
.pds-step{ display:flex; align-items:center; gap:8px; border:0; background:none; font:inherit; font-size:13.5px; color:#2d8647; font-weight:600; padding:5px 0; text-align:left; cursor:pointer; }
.pds-step:hover{ text-decoration:underline; }
.pds-step i{ font-size:16px; color:#9ea1a8; }
.pds-step.ok{ color:#65686f; font-weight:450; text-decoration:none; cursor:default; } .pds-step.ok i{ color:#1f9254; }
.pds-kv{ display:grid; grid-template-columns:auto 1fr; gap:6px 12px; margin:0; font-size:13.5px; } .pds-kv dt{ color:#65686f; } .pds-kv dd{ margin:0; font-weight:600; color:#21232c; } .pds-kv .m{ color:#9ea1a8; font-weight:450; }
.pds-note{ font-size:13.5px; color:#3d4049; line-height:1.5; margin:10px 0 0; }
.pds-rcard .pd-primary{ margin-top:12px; }
/* banner (Pipedrive "skip trial") */
.pds-banner{ position:relative; display:flex; align-items:center; gap:18px; background:#fff; border-radius:8px; box-shadow:0 1px 3px rgba(0,0,0,.07),0 0 1px rgba(0,0,0,.14); padding:14px 20px 14px 0; margin-top:16px; overflow:hidden; }
.pds-banner[hidden]{ display:none; }
.pds-bn-art{ position:relative; width:120px; align-self:stretch; display:flex; align-items:center; justify-content:center; flex:none; }
.pds-bn-art::before{ content:''; position:absolute; left:-30px; top:-40px; width:150px; height:130px; background:#e3f5e7; border-radius:0 0 90px 0; }
.pds-bn-art svg{ position:relative; }
.pds-bn-txt{ flex:1; min-width:0; } .pds-bn-txt b{ display:block; font-size:16px; font-weight:600; color:#21232c; } .pds-bn-txt span{ font-size:14px; color:#3d4049; }
.pds-flash{ outline:2px solid #8e9197 !important; outline-offset:3px; border-radius:6px; transition:outline-color .3s; }
/* section labels as Pipedrive uppercase sub-heads */
.pds-on .panel-title{ font-size:11.5px !important; font-weight:700 !important; letter-spacing:.04em !important; text-transform:uppercase !important; color:#3d4049 !important; margin-bottom:14px !important; }
.pds-on .panel-title > i, .pds-on .panel-title > .aicon{ display:none !important; }
.pds-on .panel-title .hint{ text-transform:none !important; letter-spacing:0 !important; font-weight:450 !important; }
.pds-group{ font-size:22px !important; font-weight:450 !important; }
.pds-nav-group{ text-transform:uppercase !important; letter-spacing:.04em; font-size:11.5px !important; font-weight:700 !important; color:#3d4049 !important; }
.pds-item.is-on{ background:#eef0f2 !important; box-shadow:none !important; font-weight:600; }
.pds-on .hero-mode{ text-transform:uppercase !important; background:#fff !important; box-shadow:inset 0 0 0 1px #c6c8cc; border-radius:999px !important; padding:2px 8px !important; }
.pds-on .chip.on{ background:#eef0f2 !important; border-color:#8e9197 !important; color:#21232c !important; font-weight:600; }
.pds-on .btn.btn-outline{ height:30px; font-size:13px !important; font-weight:700 !important; border-radius:6px !important; }
/* "Get more out of Apilox" */
.pds-more{ background:#fff; border-radius:8px; box-shadow:0 1px 3px rgba(0,0,0,.07),0 0 1px rgba(0,0,0,.14); padding:22px 24px 10px; margin-top:8px; }
.pds-more-h{ display:flex; align-items:center; gap:10px; margin-bottom:14px; } .pds-more-h h3{ margin:0; font-size:22px; font-weight:450; color:#21232c; }
.pds-try{ font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:#1f9254; border:1px solid #1f9254; border-radius:999px; padding:1px 8px; }
.pds-mi{ display:flex; align-items:flex-start; gap:22px; padding:10px 0 14px; }
.pds-mi-ic{ width:64px; height:64px; border-radius:6px; background:#3b2f8f; color:#fff; display:flex; align-items:center; justify-content:center; flex:none; }
.pds-mi-ic i{ font-size:34px; }
.pds-mi > div{ flex:1; min-width:0; padding-top:4px; } .pds-mi b{ font-size:16px; font-weight:600; color:#21232c; display:flex; align-items:center; gap:6px; } .pds-mi p{ margin:6px 0 0; font-size:14px; color:#3d4049; }
.pds-new{ font-size:10px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; background:#f8cf3f; color:#21232c; border-radius:999px; padding:1px 7px; }
.pds-mi-btn{ flex:none; margin-top:4px; height:28px; display:inline-flex; align-items:center; padding:0 12px; border:1px solid #c6c8cc; border-radius:6px; font-size:13px; font-weight:700; color:#21232c; text-decoration:none; background:#fff; }
.pds-mi-btn:hover{ background:#f5f5f6; }
@media (max-width:1280px){ .pds-wrap{ grid-template-columns:1fr; } .pds-rail{ position:static; display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); } }

/* ===== polish pass 2 (2026-10-22): flatter, calmer, more Pipedrive ===== */
.pds-content{ background:#f7f7f8; }
.pds-on .panel, .pds-on .acc, .pds-rcard, .pds-banner, .pds-more{ box-shadow:none !important; border:1px solid #e3e4e7 !important; }
.pds-on .panel-pad{ padding:22px 26px !important; }
.pds-on .panel-title{ display:flex !important; align-items:center; justify-content:space-between; padding-bottom:12px; border-bottom:1px solid #eef0f2; margin-bottom:18px !important; }
.pds-on .panel-title .hint{ margin-left:auto; }
.pds-group{ margin:28px 0 2px !important; padding-bottom:10px; border-bottom:1px solid #e3e4e7; }
.pds-inner > .pds-group:first-of-type{ margin-top:22px !important; }
.pds-on .hero-cover{ height:150px !important; }
.pds-on .field input, .pds-on .field select, .pds-on .field textarea{ border:1px solid #c6c8cc !important; border-radius:6px !important; box-shadow:none !important; font-size:14px !important; background:#fff !important; }
.pds-on .field input, .pds-on .field select{ height:38px !important; }
.pds-on .field input:focus, .pds-on .field select:focus, .pds-on .field textarea:focus{ border-color:#8e9197 !important; outline:none !important; }
.pds-on .field.locked input{ background:#f2f3f4 !important; border-color:#e3e4e7 !important; }
.pds-on .field-grid{ gap:16px 18px !important; }
.pds-on .acc{ margin:0 !important; }
.pds-on .acc-head{ min-height:68px; }
.pds-on .acc-icon{ background:#fff !important; border:1px solid #e3e4e7 !important; }
.pds-on .acc-chev{ color:#65686f !important; }
.pds-on .online-banner{ background:#fff !important; border:1px solid #e3e4e7 !important; }
.pds-nav a.pds-item{ text-decoration:none; }
.pds-nav .pds-nav-group:first-of-type{ padding-top:6px; }
.pds-item{ height:36px !important; border-radius:6px !important; }
.pds-content > .save-bar{ background:#21232c !important; }
.pds-step{ color:#2d8647 !important; } .pds-step.ok{ color:#65686f !important; }

/* ===== one page at a time (2026-10-22, pass 3) ===== */
.pds-off{ display:none !important; }
.pds-content{ background:#fff !important; padding:0 0 48px !important; }
.pds-head{ border-bottom:1px solid #e6e7e9; padding:26px 36px 20px; }
.pds-head h1{ margin:0; font-size:26px; line-height:34px; font-weight:450; color:#21232c; }
.pds-head p{ margin:6px 0 0; font-size:14px; color:#65686f; max-width:720px; }
.pds-wrap{ padding:24px 36px 0; max-width:1180px !important; margin:0 !important; }
.pds-content:not(.pds-is-overview) .pds-wrap{ grid-template-columns:minmax(0,860px) !important; }
.pds-inner{ gap:18px !important; }
.pds-on .settings-col{ gap:18px !important; }
.pds-banner{ margin-top:0 !important; }
/* cards: white on white, thin border, no shadow */
.pds-on .panel, .pds-on .acc, .pds-rcard, .pds-banner, .pds-more, .pds-sum{ background:#fff !important; border:1px solid #e3e4e7 !important; box-shadow:none !important; border-radius:8px !important; }
/* a solo accordion = a normal card with a header */
.pds-solo > .acc-head{ display:none !important; }   /* the page title already says what this is */
.pds-solo > .acc-head:hover{ background:#fff !important; }
.pds-solo .acc-chev{ display:none !important; }
/* overview summary card (Pipedrive "Company apilox" card) */
.pds-sum{ padding:0 !important; overflow:hidden; }
.pds-sum-top{ display:flex; align-items:center; gap:16px; padding:22px 26px; border-bottom:1px solid #e6e7e9; }
.pds-sum-logo{ width:56px; height:56px; border-radius:50%; background:#e9eaec; overflow:hidden; display:flex; align-items:center; justify-content:center; font-weight:700; color:#3d4049; flex:none; }
.pds-sum-logo img{ width:100%; height:100%; object-fit:cover; }
.pds-sum-id{ flex:1; min-width:0; } .pds-sum-id h2{ margin:0; font-size:24px; font-weight:450; color:#21232c; }
.pds-sum-id small{ display:block; font-size:13px; color:#65686f; margin-top:4px; }
.pds-sum-chips{ display:flex; gap:6px; margin-top:6px; }
.pds-chip{ font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; border-radius:999px; padding:2px 9px; box-shadow:inset 0 0 0 1px #c6c8cc; color:#3d4049; background:#fff; }
.pds-chip.on{ background:#1f7a3d; color:#fff; box-shadow:none; }
.pds-sum-row{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 26px; border-bottom:1px solid #eef0f2; }
.pds-sum-row:last-child{ border-bottom:0; }
.pds-sum-row .pds-rh{ margin-bottom:4px; }
.pds-sum-v{ font-size:15px; color:#21232c; font-weight:500; }
.pds-mi-btn{ text-decoration:none !important; }
/* the old big group headings are gone in page mode */
.pds-group{ display:none !important; }
@media (max-width:1100px){ .pds-wrap{ grid-template-columns:1fr !important; } .pds-head{ padding:20px 18px 16px; } .pds-wrap{ padding:18px 18px 0; } }


/* phones: banner stacks (text full width, button below), summary card header wraps */
@media (max-width:600px){
  .pds-banner{ flex-wrap:wrap; gap:10px 14px; padding:14px 16px !important; }
  .pds-bn-art{ display:none; }
  .pds-bn-txt{ flex:1 1 100%; }
  .pds-banner .pd-primary{ margin-left:0; }
  .pds-wrap{ padding:14px 12px 0 !important; }
  .pds-head{ padding:16px 14px 12px !important; }
  .pds-sum > *:first-child{ flex-wrap:wrap; }
}
