/*
 * GPU Pricing Calculator — plugin stylesheet
 * ---------------------------------------------------------------------
 * Everything here is scoped under .gpu-pricing-calc-root so it can
 * never leak onto the rest of the site. Bootstrap 5.x classes used in
 * the markup (row, col-*, btn, btn-group, form-select, table,
 * accordion, badge, etc.) are expected to come from the theme's own
 * already-enqueued Bootstrap — this file only layers the calculator's
 * own design on top of them.
 * ---------------------------------------------------------------------
 */
/* ===== GPU Price Meter — brand theme layered on Bootstrap 5 ===== */
@font-face {
    font-family: var(--font-family);
    src: url('https://acecloud.ai/wp-content/themes/public-cloud/assets/fonts/inter-tight/InterTight-VariableFont_wght.woff2') format("woff2");
    font-style: normal;
    font-display: optional;
}

.gpu-pricing-calc-root{
  --navy:#224193;
  --navy-deep:#18306f;
  --blue:#2a73e8;
  --teal:#0d9394;
  --teal-deep:#0a7576;
  --amber:#b7791f;
  --orange:#c2500c;
  --crimson:#c62a4c;

  --canvas:#eef3fb;
  --card:#ffffff;
  --strip:#fbfcfe;
  --win-tint:rgba(13,147,148,0.055);
  --win-tint-2:rgba(13,147,148,0.10);

  --line:rgba(46,38,61,0.11);
  --line-soft:rgba(46,38,61,0.07);
  --ink:rgba(46,38,61,0.92);
  --ink-2:rgba(46,38,61,0.62);
  --ink-3:rgba(46,38,61,0.42);

  --chip-amber-bg:rgba(255,171,29,0.15);
  --chip-orange-bg:rgba(194,80,12,0.12);
  --chip-crimson-bg:rgba(235,61,99,0.12);
  --chip-teal-bg:rgba(13,147,148,0.13);

  --shadow-card:0 1px 2px rgba(34,65,147,0.05), 0 12px 28px rgba(34,65,147,0.09);
  --shadow-btn:0 6px 16px rgba(34,65,147,0.28);

  /* --ui:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  --bs-body-font-family: var(--ui); */
  --font-family: "Inter Tight", sans-serif;
  --bs-primary: var(--navy);
  --bs-primary-rgb: 34,65,147;
}

body,
button,
input,
textarea,
select {
    font-family: var(--font-family);
}


@media (prefers-color-scheme:dark){
  .gpu-pricing-calc-root:not([data-theme="light"]){
    --canvas:#11172a;
    --card:#1a2133;
    --strip:#1d2539;
    --win-tint:rgba(13,147,148,0.10);
    --win-tint-2:rgba(13,147,148,0.16);
    --line:rgba(200,210,240,0.14);
    --line-soft:rgba(200,210,240,0.08);
    --ink:rgba(228,233,250,0.93);
    --ink-2:rgba(228,233,250,0.64);
    --ink-3:rgba(228,233,250,0.42);
    --navy:#7ba3f5;
    --teal:#3ec2bd;
    --teal-deep:#5fd6cf;
    --amber:#e8b45c;
    --orange:#f08a5c;
    --crimson:#ff8ea3;
    --chip-amber-bg:rgba(255,171,29,0.16);
    --chip-orange-bg:rgba(240,138,92,0.15);
    --chip-crimson-bg:rgba(235,61,99,0.18);
    --chip-teal-bg:rgba(13,147,148,0.22);
    --shadow-card:0 1px 2px rgba(0,0,0,0.3), 0 16px 36px rgba(0,0,0,0.42);
    --shadow-btn:0 6px 18px rgba(0,0,0,0.45);
  }
}
.gpu-pricing-calc-root[data-theme="dark"]{
  --canvas:#11172a;
  --card:#1a2133;
  --strip:#1d2539;
  --win-tint:rgba(13,147,148,0.10);
  --win-tint-2:rgba(13,147,148,0.16);
  --line:rgba(200,210,240,0.14);
  --line-soft:rgba(200,210,240,0.08);
  --ink:rgba(228,233,250,0.93);
  --ink-2:rgba(228,233,250,0.64);
  --ink-3:rgba(228,233,250,0.42);
  --navy:#7ba3f5;
  --teal:#3ec2bd;
  --teal-deep:#5fd6cf;
  --amber:#e8b45c;
  --orange:#f08a5c;
  --crimson:#ff8ea3;
  --chip-amber-bg:rgba(255,171,29,0.16);
  --chip-orange-bg:rgba(240,138,92,0.15);
  --chip-crimson-bg:rgba(235,61,99,0.18);
  --chip-teal-bg:rgba(13,147,148,0.22);
  --shadow-card:0 1px 2px rgba(0,0,0,0.3), 0 16px 36px rgba(0,0,0,0.42);
  --shadow-btn:0 6px 18px rgba(0,0,0,0.45);
}

.gpu-pricing-calc-root{
  color:var(--ink);
  /* font-family:var(--ui); */
  -webkit-font-smoothing:antialiased;
}

.shell{max-width:1060px;}

.calc{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:1rem;
  box-shadow:var(--shadow-card);
  overflow:hidden;
}

/* ---------- control strip ---------- */
.controls{
  background:var(--strip);
  border-bottom:1px solid var(--line);
}
.controls > .col-control{
  padding:1.25rem 1.5rem;
  border-right:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
}
@media (min-width:576px){ .controls > .col-control{ border-bottom:0; } }
@media (min-width:768px){
  .controls > .col-control:last-child{ border-right:0; }
}
@media (max-width:767.98px){
  .controls > .col-control:nth-child(1){ border-right:0; }
}
@media (max-width:575.98px){
  .controls > .col-control{ border-right:0; }
  .controls > .col-control:last-child{ border-bottom:0; }
}

.mini-label{
  display:block;
  /* font:600 .625rem/1 var(--ui); */
  font-size:0.625rem;
  font-weight:600;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--ink-3);
  margin-bottom:.65rem;
}

.form-select.pick{
  /* font:600 .9rem/1.25 var(--ui); */
  font-size: 0.9rem;
  font-weight:600;
  letter-spacing:-0.005em;
  color:var(--ink);
  background-color:var(--card);
  border-color:var(--line);
  border-radius:.625rem;
  padding:.65rem 2rem .65rem .8rem;
}
.form-select.pick:hover{border-color:rgba(42,115,232,0.45);}
.form-select.pick:focus{
  border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(42,115,232,0.18);
}

.spec-line{
  margin:.65rem 0 0;
  /* font:400 .72rem/1.4 var(--mono); */
  font-size:0.72rem;
  font-weight:400;
  color:var(--ink-3);
}
.spec-line b{font-weight:600;color:var(--ink-2);}

.seg-group{
  flex-wrap:wrap;
  gap:.375rem;
}
.seg-group .btn{
  /* font:600 .85rem/1 var(--mono); */
  font-size:0.85rem;
  font-weight:600;
  padding:.7rem .5rem;
  border-radius:.625rem !important;
  border-color:var(--line);
  color:var(--ink-2);
  background:var(--card);
  flex:1 1 auto;
  min-width:2.6rem;
}
.seg-group .btn + .btn{ margin-left:0; }
.seg-group .btn:hover{border-color:rgba(42,115,232,0.45);color:var(--ink);}
.seg-group .btn.active,
.seg-group .btn-check:checked + .btn{
  background:var(--navy);
  border-color:var(--navy);
  color:#fff;
  box-shadow:0 4px 12px rgba(34,65,147,0.28);
}
.gpu-pricing-calc-root[data-theme="dark"] .seg-group .btn.active{color:#0f1526;}
@media (prefers-color-scheme:dark){
  .gpu-pricing-calc-root:not([data-theme="light"]) .seg-group .btn.active{color:#0f1526;}
}

/* ---------- results ---------- */
.results{padding:1.35rem 1.5rem .25rem;}
.live-badge{
  /* font:500 .72rem/1 var(--ui); */
  font-size:0.72rem;
  font-weight:500;
  color:var(--ink-2);
}
.live-dot{
  width:7px;height:7px;border-radius:50%;
  background:#22b573;position:relative;display:inline-block;
}
.live-dot::after{
  content:"";position:absolute;inset:-3px;border-radius:50%;
  border:1px solid #22b573;
  animation:ping 2.4s ease-out infinite;
}
@keyframes ping{0%{transform:scale(.6);opacity:.85}100%{transform:scale(2.2);opacity:0}}

.gpu-table thead th{
  /* font:600 .625rem/1 var(--ui); */
  font-size:0.625rem;
  font-weight:600;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--ink-3);
  border-bottom:1px solid var(--line);
  white-space:nowrap;
  padding-bottom:.75rem;
}
.gpu-table tbody td{
  padding:1.05rem .875rem;
  border-bottom:1px solid var(--line-soft);
  vertical-align:middle;
  background:transparent;
}
.gpu-table tbody tr:last-child td{border-bottom:0;}
.gpu-table tbody tr.ace td{background:var(--win-tint);}

.provider-name{
  display:flex;align-items:center;gap:.55rem;flex-wrap:wrap;
  /* font:600 .95rem/1.2 var(--ui); */
  font-size:0.95rem;
  font-weight:600;
  letter-spacing:-0.012em;
}
tr.ace .provider-name{color:var(--navy);font-weight:700;}

.badge.tag-teal{
  /* font:600 .58rem/1 var(--ui); */
  font-size:0.58rem;
  font-weight:600;
  letter-spacing:.09em;
  text-transform:uppercase;
  background:var(--chip-teal-bg) !important;
  color:var(--teal-deep) !important;
}

.instance-code{
  /* font:400 .78rem/1.3 var(--mono); */
  font-size:0.78rem;
  font-weight:400;
  color:var(--ink-2);
  word-break:break-all;
}
tr.ace .instance-code{color:var(--ink);font-weight:500;}

.cost-figure{
  /* font:600 1.03rem/1.2 var(--mono); */
  font-size:1.03rem;
  font-weight:600;
  font-variant-numeric:tabular-nums;
  letter-spacing:-0.015em;
  white-space:nowrap;
}
tr.ace .cost-figure{font-size:1.19rem;font-weight:600;color:var(--navy);}
.sub-line{
  display:block;
  /* font:400 .655rem/1.35 var(--ui); */
  font-size:0.655rem;
  font-weight:400;
  letter-spacing:.02em;
  color:var(--ink-3);
  margin-top:.25rem;
}
.annual-figure{
  /* font:500 .9rem/1.2 var(--mono); */
  font-size:0.9rem;
  font-weight:500;
  font-variant-numeric:tabular-nums;
  color:var(--ink-2);
  white-space:nowrap;
}
tr.ace .annual-figure{color:var(--ink);}

.badge.verdict{
  /* font:600 .75rem/1.25 var(--ui); */
  font-size:0.75rem;
  font-weight:600;
  padding:.45rem .75rem;
  white-space:nowrap;
}
.badge.verdict.win{background:var(--chip-teal-bg) !important;color:var(--teal-deep) !important;}
.badge.verdict.na{background:transparent !important;color:var(--ink-3) !important;box-shadow:inset 0 0 0 1px var(--line);}
.badge.verdict.lo{background:var(--chip-amber-bg) !important;color:var(--amber) !important;}
.badge.verdict.mid{background:var(--chip-orange-bg) !important;color:var(--orange) !important;}
.badge.verdict.hi{background:var(--chip-crimson-bg) !important;color:var(--crimson) !important;}

tr.na .provider-name{color:var(--ink-2);font-weight:500;}
.na-text{
  /* font:500 .78rem/1.3 var(--ui); */
  font-size:0.78rem;
  font-weight:500;
  color:var(--ink-3);
  font-style:italic;
}
.dash-figure{
  /* font:500 1.03rem/1.2 var(--mono); */
  font-size:1.03rem;
  font-weight:500;
  color:var(--ink-3);
}

.gap-note{
  margin:1rem 0 0;
  /* font:400 .78rem/1.5 var(--ui); */
  font-size: 0.78rem;
  font-weight:400;
  color:var(--ink-2);
}
.gap-note b{
  /* font:600 .78rem/1.5 var(--mono); */
  font-size:0.78rem;
  font-weight:600;
  color:var(--teal-deep);}

/* ---------- footer ---------- */
.calc-foot{
  padding:1.25rem 1.5rem;
  margin-top:1.25rem;
  border-top:1px solid var(--line);
  background:var(--strip);
}

.calc-foot .accordion-item{background:transparent;border:0;}
.calc-foot .accordion-button{
  background:transparent;
  padding:0;
  /* font:600 .625rem/1 var(--ui); */
  font-size:0.625rem;
  font-weight:600;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--ink-2);
  box-shadow:none !important;
  display:inline-flex;
  align-items:center;
  gap:.5rem;
}
.calc-foot .accordion-button:not(.collapsed){color:var(--ink-2);background:transparent;}
.calc-foot .accordion-button::after{
  display:none;
}
.calc-foot .accordion-button::before{
  content:"−";
  /* font:600 .8rem/1 var(--ui); */
  font-size:0.8rem;
  font-weight:600;
  color:var(--blue);
  flex:none;
}
.calc-foot .accordion-button.collapsed::before{
  content:"+";
}
.calc-foot .accordion-body{
  padding:.75rem 0 0;
  /* font:400 .78rem/1.65 var(--ui); */
  font-size:0.78rem;
  font-weight:400;
  color:var(--ink-2);
  max-width:64ch;
}
.calc-foot .accordion-body ul{margin:0;padding:0;list-style:none;display:grid;gap:.45rem;}
.calc-foot .accordion-body li{position:relative;padding-left:.9rem;}
.calc-foot .accordion-body li::before{
  content:"";position:absolute;left:0;top:.5rem;
  width:4px;height:4px;border-radius:50%;background:var(--teal);
}
.calc-foot .accordion-body li b{color:var(--ink);font-weight:600;}

.btn.btn-ghost{background:var(--card);border-color:var(--line);color:var(--ink);}
.btn.btn-ghost:hover{border-color:rgba(42,115,232,0.5);color:var(--navy);background:var(--card);}
.btn.btn-brand{
  background:linear-gradient(135deg,var(--navy-deep),var(--blue));
  border-color:transparent;
  color:#fff;
  box-shadow:var(--shadow-btn);
}
/*.btn.btn-brand:hover{transform:translateY(-1px);color:#fff;}*/

.custom-border {
  border: none !important;
}

/* ---------- narrow ---------- */
@media (max-width:575.98px){
  .actions-row{width:100%;}
  .actions-row .btn{flex:1 1 auto;}
}

@media (max-width:575.98px){
  .gpu-table thead{
    position:absolute;width:1px;height:1px;overflow:hidden;
    clip:rect(0 0 0 0);white-space:nowrap;
  }
  .gpu-table tbody tr{
    display:block;
    border:1px solid var(--line);
    border-radius:.625rem;
    margin-bottom:.65rem;
    overflow:hidden;
  }
  .gpu-table tbody tr.ace{border-color:var(--win-tint-2);}
  .gpu-table tbody td{
    display:flex;align-items:center;justify-content:space-between;gap:1rem;
    padding:.7rem .875rem;
    border-bottom:1px solid var(--line-soft);
    flex-wrap:wrap;
  }
  .gpu-table tbody td:last-child{border-bottom:0;}
  .gpu-table tbody td .sub-line{width:100%;text-align:right;margin-top:.15rem;}
  .gpu-table tbody td::before{
    content:attr(data-label);
    /* font:600 .58rem/1 var(--ui); */
    font-size:0.58rem;
    font-weight:600;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:var(--ink-3);
    flex:none;
  }
  .gpu-table tbody td:first-child::before{display:none;}
  .gpu-table tbody td:first-child{justify-content:flex-start;}
  .instance-code{text-align:right;}
}

@media (prefers-reduced-motion:reduce){
  .live-dot::after{animation:none;}
  .btn,.form-select{transition:none;}
}

