/* Ergänzungen für den eigenständigen iPhone-15-Hüllen-Prototypen. Die Seite
   erwartet page-3d-studio-zahnrad.css und page-3d-studio-gehaeuse.css als Basis. */
.phonecase-page{--phonecase-tpu:#202428;--phonecase-asa:#202428;--phonecase-accent:#c62828;background:#07101a}
#phonecase-designer{scroll-margin-top:118px}

#phonecase-canvas{position:absolute;inset:0;display:block;width:100%!important;height:100%!important;touch-action:none}
#phonecase-canvas.has-editable-surface-hover{cursor:pointer}
.phonecase-surface-palette p{margin:0;color:#47606c;font-size:.65rem;line-height:1.4}
.phonecase-canvas-wrap{background:
    radial-gradient(circle at 58% 46%,rgba(0,206,168,.08),transparent 23%),
    linear-gradient(180deg,#07111b,#050c13)}
.phonecase-part-legend{flex-wrap:wrap;max-width:calc(100% - 32px)}
.phonecase-part-legend [data-phonecase-legend=bumper]{background:var(--phonecase-tpu)}
.phonecase-part-legend [data-phonecase-legend=backPlate]{background:var(--phonecase-asa)}
.phonecase-part-legend [data-phonecase-legend=accent]{background:var(--phonecase-accent)}
.phonecase-page #phonecase-simulate-insert.is-active{border-color:#00cea8!important;color:#7fffe9!important;box-shadow:0 0 0 1px rgba(0,206,168,.16) inset}
.phonecase-metrics{grid-template-columns:repeat(5,minmax(0,1fr))}
.phonecase-metrics strong{overflow-wrap:anywhere}
.phonecase-model-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.phonecase-model-grid article{position:relative;transition:border-color .18s ease,background-color .18s ease,transform .18s ease}
.phonecase-model-grid article.is-active{border-color:rgba(0,206,168,.68);background:rgba(0,206,168,.07);box-shadow:0 0 0 1px rgba(0,206,168,.12) inset}
.phonecase-model-grid article.is-active::after{position:absolute;top:14px;right:14px;color:#00cea8;content:"✓";font-weight:900}
.phonecase-model-grid article:hover{transform:translateY(-2px)}

.phonecase-page .gear-result-card.phonecase-result-card{grid-template-columns:minmax(0,1fr) auto;align-items:start}
.phonecase-validation-state{grid-column:2;grid-row:1;display:grid;gap:5px;justify-self:end;min-width:210px;padding:13px 15px;border:1px solid rgba(253,225,0,.28);border-radius:11px;background:rgba(253,225,0,.055)}
.phonecase-validation-state span{color:#9baab3;font-size:.66rem;font-weight:780;letter-spacing:.07em;text-transform:uppercase}
.phonecase-validation-state strong{color:#fff2a1;font:820 .9rem/1.25 Rubik,Arial,sans-serif}
.phonecase-product-summary{grid-column:1/-1}.phonecase-result-actions{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:10px;width:100%}
.phonecase-result-actions>button,.phonecase-result-actions>a{flex:1 1 240px}
.elementor-kit-723 .phonecase-page .phonecase-result-actions #phonecase-download-3mf,.phonecase-page .phonecase-result-actions #phonecase-download-3mf{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-width:0;min-height:50px;margin:0;padding:13px 20px;border:0;border-radius:8px;background:#fde100;box-shadow:none;color:#0a0b0e;font:700 .95rem/1.2 Rubik,Arial,sans-serif;cursor:pointer;transition:opacity .2s,transform .15s,background-color .15s}
.elementor-kit-723 .phonecase-page .phonecase-result-actions #phonecase-download-3mf:hover:not(:disabled),.elementor-kit-723 .phonecase-page .phonecase-result-actions #phonecase-download-3mf:focus-visible:not(:disabled),.phonecase-page .phonecase-result-actions #phonecase-download-3mf:hover:not(:disabled),.phonecase-page .phonecase-result-actions #phonecase-download-3mf:focus-visible:not(:disabled){background:#fff06a;transform:translateY(-1px)}
.elementor-kit-723 .phonecase-page .phonecase-result-actions #phonecase-download-3mf:disabled,.phonecase-page .phonecase-result-actions #phonecase-download-3mf:disabled{background:#18222d;color:#718296;cursor:not-allowed;opacity:.78;transform:none}
.phonecase-request-button{display:inline-flex;min-height:48px;padding:0 18px;align-items:center;justify-content:center;border:1px solid #00cea8;border-radius:10px;background:transparent;color:#dffff9!important;font:820 .82rem/1.2 Rubik,Arial,sans-serif;text-align:center;text-decoration:none;transition:background-color .18s ease,color .18s ease,transform .18s ease}
.phonecase-request-button:hover,.phonecase-request-button:focus-visible{background:rgba(0,206,168,.14);color:#fff!important;transform:translateY(-1px)}
.phonecase-result-card #phonecase-feedback{grid-column:1/-1;margin:0}
.phonecase-result-card #phonecase-validation-message.is-error,.phonecase-result-card .gear-validation-list .is-error{color:#ffabab}
.phonecase-result-card .gear-validation-list .is-warning{color:#ffeca0}

.phonecase-material-stack{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:10px 0 18px}
.phonecase-material-stack article{display:grid;align-content:start;gap:5px;padding:15px;border:1px solid rgba(255,255,255,.09);border-radius:11px;background:#0b1722}
.phonecase-material-stack span{color:#78909d;font-size:.64rem;font-weight:800;letter-spacing:.075em;text-transform:uppercase}
.phonecase-material-stack strong{color:#f1f8fb;font:820 .91rem/1.25 Rubik,Arial,sans-serif}
.phonecase-material-stack p{margin:2px 0 0;color:#91a5b2;font-size:.72rem;line-height:1.5}
.phonecase-engineering-defaults{margin:0 0 16px;padding:14px;border:1px solid rgba(253,225,0,.25);border-radius:11px;background:rgba(253,225,0,.045)}
.phonecase-engineering-defaults>strong{display:block;margin-bottom:10px;color:#fff0a0;font:820 .72rem/1.3 Rubik,Arial,sans-serif;letter-spacing:.055em;text-transform:uppercase}
.phonecase-engineering-defaults dl{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto;gap:0 12px;margin:0}
.phonecase-engineering-defaults dt,.phonecase-engineering-defaults dd{padding:7px 0;border-bottom:1px solid rgba(255,255,255,.075);font-size:.7rem;line-height:1.35}
.phonecase-engineering-defaults dt{color:#91a5b2}.phonecase-engineering-defaults dd{margin:0;color:#edf7fa;font-weight:800;text-align:right;font-variant-numeric:tabular-nums}
.phonecase-personal-panel{margin:10px 0 18px;padding:15px;border:1px solid rgba(255,255,255,.08);border-radius:11px;background:rgba(7,17,26,.72)}
.phonecase-personal-panel[hidden]{display:none!important}
.phonecase-personal-panel .enclosure-font-list{margin-bottom:0}
.phonecase-personal-settings{margin-top:18px}
.phonecase-page .phonecase-tool-dialog input[type=number]{width:100%;min-height:48px;border:1px solid #2b4152;border-radius:10px;background:#0b1722;color:#edf7fa}
.phonecase-page #phonecase-personal-dialog{width:min(610px,calc(100% - 288px))}
.phonecase-page .phonecase-tool-dialog .gear-toggle{padding:12px;border:1px solid rgba(255,255,255,.075);border-radius:10px;background:#0a151f}
.phonecase-page .phonecase-tool-dialog .gear-toggle:focus-within{border-color:#00cea8;box-shadow:0 0 0 3px rgba(0,206,168,.1)}
.phonecase-page .phonecase-tool-dialog .enclosure-field>small{justify-self:end;margin-top:-2px;padding:3px 7px;border-radius:999px;background:rgba(255,255,255,.045);font-size:.67rem;font-variant-numeric:tabular-nums}

.phonecase-steps{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.phonecase-fact-grid article:last-child{border-color:rgba(198,40,40,.26)}
.phonecase-safety-note{border-color:rgba(253,225,0,.32)!important;background:linear-gradient(145deg,rgba(253,225,0,.075),rgba(10,22,33,.96))!important}
.phonecase-dimension-table-wrap{max-width:100%;margin-top:28px;overflow-x:auto;border:1px solid rgba(255,255,255,.1);border-radius:13px;background:linear-gradient(145deg,rgba(14,29,42,.94),rgba(8,19,29,.96))}
.phonecase-dimension-table{width:100%;min-width:680px;border-collapse:collapse;color:#dce8ed;font-size:.82rem}
.phonecase-dimension-table caption{padding:13px 16px;border-bottom:1px solid rgba(255,255,255,.075);color:#9eb1bc;text-align:left;font-size:.74rem;line-height:1.45}
.phonecase-dimension-table th,.phonecase-dimension-table td{padding:12px 15px;border-bottom:1px solid rgba(255,255,255,.075);text-align:left;vertical-align:top}
.phonecase-dimension-table th{background:rgba(0,206,168,.09);color:#7cebd8;font-size:.68rem;letter-spacing:.06em;text-transform:uppercase}
.phonecase-dimension-table tr:last-child td{border-bottom:0}.phonecase-dimension-table td:nth-child(2){font-variant-numeric:tabular-nums;white-space:nowrap}
.phonecase-dimension-table a,.phonecase-source-qualification a{color:#7cebd8;text-underline-offset:3px}
.phonecase-source-qualification{margin:15px 2px 0;color:#9eb1bc;font-size:.78rem;line-height:1.65}
.phonecase-check-list{display:grid;gap:9px;margin:0;padding:0;list-style:none;color:#a8bac3;font-size:.87rem;line-height:1.55}
.phonecase-check-list li{position:relative;padding-left:23px}.phonecase-check-list li::before{position:absolute;left:0;color:#00cea8;content:"✓";font-weight:900}
.phonecase-trademark-note{margin:19px 2px 0;color:#718895;font-size:.7rem;line-height:1.55}
.phonecase-source-section{padding-bottom:24px}
.phonecase-download-dialog .gear-dialog-notice:first-of-type{border-color:rgba(253,225,0,.28);background:rgba(253,225,0,.055)}
.phonecase-download-dialog .gear-dialog-notice p+p{margin-top:10px}.phonecase-download-dialog .gear-dialog-notice a{color:#7cebd8;text-underline-offset:3px}
.elementor-kit-723 .phonecase-download-dialog #phonecase-download-confirm,.phonecase-download-dialog #phonecase-download-confirm{min-height:44px;margin:0;padding:0 18px;border:1px solid #00cea8;border-radius:8px;background:#00cea8;box-shadow:none;color:#03110e;font:800 .72rem/1 Rubik,Arial,sans-serif;cursor:pointer}
.elementor-kit-723 .phonecase-download-dialog #phonecase-download-confirm:hover:not(:disabled),.elementor-kit-723 .phonecase-download-dialog #phonecase-download-confirm:focus-visible:not(:disabled),.phonecase-download-dialog #phonecase-download-confirm:hover:not(:disabled),.phonecase-download-dialog #phonecase-download-confirm:focus-visible:not(:disabled){background:#6af1d9;border-color:#6af1d9}
.elementor-kit-723 .phonecase-download-dialog #phonecase-download-confirm:disabled,.phonecase-download-dialog #phonecase-download-confirm:disabled{border-color:#263442;background:#18222d;color:#718296;cursor:not-allowed}

.phonecase-page button:focus-visible,.phonecase-page a:focus-visible,.phonecase-page input:focus-visible,.phonecase-page select:focus-visible,.phonecase-download-dialog button:focus-visible,.phonecase-download-dialog input:focus-visible{outline:3px solid rgba(0,206,168,.45);outline-offset:3px}

@media(min-width:1025px){
    .phonecase-page .phonecase-canvas-tools{width:224px}
    .phonecase-page .phonecase-tool-dialog{left:262px;width:min(720px,calc(100% - 280px));max-width:calc(100% - 280px)}
    .phonecase-page #phonecase-personal-dialog{width:min(610px,calc(100% - 280px))}
    .phonecase-canvas-wrap.has-personalization-editor #phonecase-canvas{transform:translateX(14%) scale(.68);transform-origin:right center;transition:transform .24s ease}
}
@media(max-width:1100px){.phonecase-model-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.phonecase-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1024px){.phonecase-page #phonecase-personal-dialog{width:calc(100% - 84px);max-width:calc(100% - 84px)}.phonecase-material-stack{grid-template-columns:1fr}.phonecase-steps{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:700px){
    .phonecase-page .gear-result-card.phonecase-result-card{grid-template-columns:1fr}.phonecase-validation-state{grid-column:1;grid-row:auto;justify-self:stretch;min-width:0}.phonecase-product-summary{grid-column:1}.phonecase-result-actions{grid-column:1;flex-direction:column}.phonecase-result-actions>button,.phonecase-result-actions>a{width:100%;flex-basis:auto}
    .phonecase-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.phonecase-model-grid{grid-template-columns:1fr}.phonecase-steps{grid-template-columns:1fr!important}
    .phonecase-page #phonecase-personal-dialog{position:fixed;inset:max(10px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));width:auto;max-width:none;height:auto;max-height:none}
    .phonecase-download-dialog .gear-dialog-actions{width:100%}.elementor-kit-723 .phonecase-download-dialog #phonecase-download-confirm,.phonecase-download-dialog #phonecase-download-confirm{width:100%;min-height:48px}
    .phonecase-placement-controls{grid-template-columns:1fr}.phonecase-source-qualification,.phonecase-trademark-note{margin-inline:0}
}
@media(max-width:700px){.phonecase-engineering-defaults dl{grid-template-columns:minmax(0,1fr) auto}}
@media(max-width:420px){.phonecase-metrics{grid-template-columns:1fr}.phonecase-page .enclosure-logo-actions{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.phonecase-model-grid article,.phonecase-request-button,.phonecase-canvas-wrap.has-personalization-editor #phonecase-canvas,.phonecase-page #phonecase-simulate-insert{transition:none}}
