/* Shared card materials for Mina firanden and its portals.
   Explicit component selectors leave customer-created invitations and canvases intact. */
body:is(.lc-service-page,.baby-page){
 --lc-card-paper:#fffdf9;--lc-card-line:#e6dfd4;--lc-card-ink:#3d433b;
 --lc-card-accent:#56634d;--lc-card-wash:#f4f3ec;--lc-card-detail:#a38d67;
 --lc-card-radius:20px;--lc-card-shadow:0 3px 9px #39332603,0 16px 38px #39332606;
}
body:has(.mn),body:has([data-welcome=close_people]){--lc-card-accent:#795568;--lc-card-wash:#f8f1f2}
body:has(.min-bakning),body:has([data-welcome=baking]){--lc-card-accent:#805b42;--lc-card-wash:#faf4e9}
body:has(#app .cf-landing){--lc-card-accent:#754c59;--lc-card-wash:#f7f0f2}
body.baby-page{--lc-card-accent:#405c49;--lc-card-wash:#f1f3eb}
/* Surfaces, shared by static pages and cards rendered after sign-in. */
body:is(.lc-service-page,.baby-page) :is(main,#app,#services,#main,#service-main) :is(
 .card,.flyer-card,.inspiration-card,.mb-card,.mn-card,.bip-card,.bc-card,.eco-card,.wsc-card,.pq-card,.pa-activity-card,
 .gc-card,.gc-person-card,.household-card,.loyalty-card,.recipe-card,.event-card,
 .focus-card,.readiness-card,.next-card,.calm-next-card,.handover-card,.tc-card,
 .wc-card,.wc-choice-card,.wc-directory-card,.sg-card,.sg-start-card,.lc-day-card,
 .lc-action-card,.lc-budget-card,.lc-widget-card,.bar-package-card,.mb-fika-card,
 .overview-card,.portal-entry-card,.service-start-card,.service-choice,.occasion,
 .celebration-choice,.occasion-choice,.baby-entry-card,.baby-example-card,.baby-gift,
 .baby-inline-form,.baby-choice-grid>article,.services-help,.wg-invite-choice){
 box-sizing:border-box;min-width:0;max-width:100%;
 border:1px solid var(--lc-card-line);border-radius:var(--lc-card-radius);
 background:var(--lc-card-paper);box-shadow:var(--lc-card-shadow);
}
/* Comfortable outer spacing; dense rows and image cards keep their own layout. */
body.lc-service-page :is(main,#app,#services,#main,#service-main) :is(
 .card,.mb-card,.mn-card:not(.mn-day),.bip-card,.eco-card,.wsc-card,.pq-card,
 .gc-card,.gc-person-card,.household-card,.loyalty-card,.event-card,.readiness-card,
 .portal-entry-card,.service-start-card,.service-choice,.occasion,.baby-entry-card){
 padding:clamp(20px,2.5vw,30px);
}
body:is(.lc-service-page,.baby-page) :is(main,#app,#services,#main,#service-main) :is(
 .card,.mb-card,.mn-card,.bip-card,.eco-card,.gc-card,.portal-entry-card,.overview-card,
 .baby-gift-content,.baby-choice-grid>article)>:is(h2,h3){
 font-family:Georgia,'Times New Roman',serif;font-weight:400;line-height:1.22;
 letter-spacing:-.025em;font-size:clamp(23px,2.2vw,29px);margin-top:0;margin-bottom:12px;
}
body.lc-service-page #services .service-choice h3,
body.lc-service-page :is(main,#app,#service-main) .occasion strong,
body.lc-service-page :is(main,#app,#service-main) .portal-entry-card h3{
 font:400 clamp(22px,2.2vw,28px)/1.2 Georgia,serif;letter-spacing:-.025em;
}
body.lc-service-page #services .service-choice p{line-height:1.6}
body.lc-service-page #services .service-choice-icon{
 background:var(--lc-card-wash);border:1px solid var(--lc-card-line);border-radius:50%;
 width:50px;height:50px;flex-basis:50px;font-size:24px;
}
/* Softly tinted feature and sharing cards, rather than competing colour blocks. */
body:is(.lc-service-page,.baby-page) :is(main,#app,#services,#main,#service-main) :is(
 .baby-entry-card,.baby-sharing,.wg-invite-choice,.services-help,.mb-notice,
 .rsvp-share-panel,.rsvp-qr-panel,.service-start-panel){
 background:var(--lc-card-wash)!important;border:1px solid var(--lc-card-line);
 border-radius:var(--lc-card-radius);box-shadow:none;color:var(--lc-card-ink);
}
body.lc-service-page :is(main,#app,#services,#main,#service-main) :is(
 .portal-example,.portal-discover,.portal-wedding-tools,.portal-next-tools,.service-info-fold){
 background:var(--lc-card-paper);border:1px solid var(--lc-card-line);
 border-radius:16px;box-shadow:none;padding-inline:20px;
}
body.lc-service-page :is(main,#app,#services,#main,#service-main) :is(
 .portal-example,.portal-discover,.portal-wedding-tools,.portal-next-tools,.service-info-fold)>summary{
 padding-block:17px;font-size:15px;line-height:1.5;
}
/* Editorial illustrations use the same paper and finer frame. */
body.lc-service-page #app :is(.cf-example-plan,.cf-story-result,.cf-tool-preview,.cf-site-preview),
body.lc-service-page main .portal-feature-card{
 border:1px solid var(--lc-card-line);border-radius:22px;background:var(--lc-card-paper);
 box-shadow:var(--lc-card-shadow);
}
body.lc-service-page #app :is(.cf-feature-visual,.cf-agent-story){background:#f5efed}
body.lc-service-page #app .cf-directory-grid details{
 background:var(--lc-card-paper);border-color:var(--lc-card-line);border-radius:18px;
}
body.baby-page .baby-example-card{transform:none;padding:32px}
body.baby-page .baby-choice-grid article:nth-child(n){background:var(--lc-card-paper)}
body.baby-page .baby-choice-grid article .eyebrow{color:var(--lc-card-accent)}
body.baby-page .baby-shop{background:var(--lc-card-wash);border:1px solid var(--lc-card-line);border-radius:24px}
body.baby-page .baby-gift-content{padding:26px}
body.baby-page .baby-gift>img{background:#f6f4ee}
body.baby-page .baby-gift-placeholder{background:var(--lc-card-wash);color:var(--lc-card-accent)}
body.baby-page .baby-inline-form{padding:30px}
/* One quiet rhythm between cards. */
body.lc-service-page :is(main,#app,#services,#main,#service-main) :is(
 .cards,.card-grid,.mb-grid,.mn-grid,.bip-grid,.services-grid,.overview-grid){gap:20px}
body.lc-service-page :is(main,#app,#services,#main,#service-main) :is(
 .card,.mb-card,.mn-card,.portal-entry-card,.service-choice,.occasion) :is(p,small){overflow-wrap:anywhere}
/* Only clickable cards respond to pointer hover. Selected states remain explicit. */
@media(hover:hover) and (prefers-reduced-motion:no-preference){
 body.lc-service-page :is(main,#app,#services,#main,#service-main) :is(a.service-choice,a.portal-entry-card,a.baby-entry-card,button.occasion){
 transition:box-shadow .2s ease,border-color .2s ease,transform .2s ease;
 }
 body.lc-service-page :is(main,#app,#services,#main,#service-main) :is(a.service-choice,a.portal-entry-card,a.baby-entry-card,button.occasion):hover{
 border-color:#b6a58b;box-shadow:0 8px 26px #443c3010;transform:translateY(-2px);
 }
}
body.lc-service-page :is(main,#app,#services,#main,#service-main) :is(
 .service-choice,.occasion,.card,.mb-card,.mn-card,.celebration-choice).is-selected,
body.lc-service-page :is(main,#app,#services,#main,#service-main) :is(
 .service-choice,.occasion,.card,.mb-card,.mn-card,.celebration-choice)[aria-pressed=true]{
 border-color:var(--lc-card-accent);box-shadow:inset 0 0 0 1px var(--lc-card-accent);background:var(--lc-card-wash);
}
body:is(.lc-service-page,.baby-page) main :is(a,button,summary):focus-visible{
 outline:3px solid #89576a;outline-offset:4px;
}
@media(max-width:650px){
 body:is(.lc-service-page,.baby-page){--lc-card-radius:16px}
 body.lc-service-page :is(main,#app,#services,#main,#service-main) :is(
 .card,.mb-card,.mn-card:not(.mn-day),.bip-card,.eco-card,.gc-card,.portal-entry-card,
 .service-start-card,.service-choice,.occasion,.baby-entry-card){padding:20px}
 body.lc-service-page :is(main,#app,#services,#main,#service-main) :is(
 .cards,.card-grid,.mb-grid,.mn-grid,.bip-grid,.services-grid,.overview-grid){gap:14px}
 body.baby-page :is(.baby-gift-content,.baby-inline-form,.baby-example-card){padding:22px}
 body.baby-page .baby-choice-grid article{padding:26px}
 body.lc-service-page #services .service-choice{gap:14px;min-height:104px}
}
@media(prefers-reduced-motion:reduce){
 body.lc-service-page :is(main,#app,#services,#main,#service-main) :is(.service-choice,.portal-entry-card,.occasion){transition:none;transform:none}
}
@media(forced-colors:active){
 body:is(.lc-service-page,.baby-page) main :is(.card,.mb-card,.mn-card,.service-choice,.baby-gift){border-color:CanvasText;box-shadow:none}
}
@media print{
 body:is(.lc-service-page,.baby-page) main :is(.card,.mb-card,.mn-card,.service-choice,.baby-gift){box-shadow:none;background:white;break-inside:avoid}
}

/* Portal entry and photo cards share the same typography without adding image padding. */
body.lc-service-page :is(main,#app,#services,#main,#service-main) .flyer-card{padding:26px}
body.lc-service-page :is(main,#app,#services,#main,#service-main) :is(.flyer-card,.inspiration-card) h3{font:400 clamp(23px,2.2vw,28px)/1.22 Georgia,serif;letter-spacing:-.025em}
body.lc-service-page :is(main,#app,#services,#main,#service-main) .overview-heading{background:var(--lc-card-wash);border-bottom:1px solid var(--lc-card-line);padding:20px}
body.lc-service-page :is(main,#app,#services,#main,#service-main) .overview-heading h3{font:400 23px/1.25 Georgia,serif}
body.lc-service-page :is(main,#app,#services,#main,#service-main) .portal-entry-card{border-top:2px solid #c8b99d}
/* Interactive portal examples use the same material as the real workspace. */
body:has(.demo-layout){--lc-card-paper:#fffdf9;--lc-card-line:#e6dfd4;--lc-card-shadow:0 12px 32px #39332606}
body .demo-layout :is(.demo-workspace,.demo-aside){background:var(--lc-card-paper);border:1px solid var(--lc-card-line);box-shadow:var(--lc-card-shadow)}
body .demo-layout .demo-aside{background:#f4f3ec}
body .demo-layout :is(.demo-workspace,.demo-aside) h2{font:400 28px/1.22 Georgia,serif;letter-spacing:-.025em}
@media(max-width:650px){body.lc-service-page :is(main,#app,#services,#main,#service-main) .flyer-card{padding:20px}}

/* Dialogs and their fields: the shared creation/editing experience. */
body:is(.lc-service-page,.baby-page) dialog{
 box-sizing:border-box;color:#384038;background:#fffdf9;
 border:1px solid #e4ded4;border-radius:24px;
 padding:36px;width:min(560px,calc(100vw - 32px));max-width:calc(100vw - 32px);
 max-height:calc(100dvh - 40px);overflow:auto;overscroll-behavior:contain;
 box-shadow:0 28px 90px #252b2430,0 2px 12px #252b240a;
 font:400 15px/1.6 system-ui,sans-serif;
}
body:is(.lc-service-page,.baby-page) dialog::backdrop{background:#252d285c;backdrop-filter:blur(7px)}
body:is(.lc-service-page,.baby-page) dialog :is(h1,h2){
 font:400 clamp(28px,3.8vw,36px)/1.15 Georgia,serif;letter-spacing:-.035em;
 color:#354336;margin:0 26px 24px 0;overflow-wrap:anywhere;
}
body:is(.lc-service-page,.baby-page) dialog :is(h1,h2,h3)[tabindex="-1"]:focus{outline:none;box-shadow:none}
body:is(.lc-service-page,.baby-page) dialog .eyebrow{
 display:block;font:600 10px/1.5 system-ui,sans-serif;letter-spacing:.18em;
 color:#896572;margin:0 32px 10px 0;
}
body:is(.lc-service-page,.baby-page) dialog :is(.close,[data-close],.service-login-close){
 position:absolute;right:14px;top:14px;float:none;display:grid;place-items:center;
 width:44px;min-width:44px;height:44px;min-height:44px;padding:0;margin:0;
 background:#f3f1eb;color:#586153;border:1px solid #e8e3d9;border-radius:50%;
 font:400 24px/1 system-ui;box-shadow:none;z-index:2;
}
body:is(.lc-service-page,.baby-page) dialog form{margin:0;border:0;padding:0;background:transparent}
body:is(.lc-service-page,.baby-page) dialog form label,
body:is(.lc-service-page,.baby-page) dialog>label{
 display:block;min-width:0;margin:20px 0 0;padding:0;
 color:#414c40;font:500 13px/1.6 system-ui,sans-serif;
}
body:is(.lc-service-page,.baby-page) dialog [data-service-field-label]{
 display:inline;color:#788073;font:400 11px/1.6 system-ui;white-space:nowrap;
}
body:is(.lc-service-page,.baby-page) dialog :is(input,select,textarea):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=hidden]):not([type=submit]):not([type=button]){
 box-sizing:border-box;display:block;width:100%;max-width:100%;min-width:0;
 min-height:48px;height:auto;margin:7px 0 0;padding:12px 14px;
 border:1px solid #d8dcd1;border-radius:10px;background-color:#fff;
 color:#354336;font:400 16px/1.4 system-ui,sans-serif;
 box-shadow:0 1px 2px #26352403;transition:border-color .15s,box-shadow .15s;
}
body:is(.lc-service-page,.baby-page) dialog input::placeholder,
body:is(.lc-service-page,.baby-page) dialog textarea::placeholder{color:#8a8d84;font-size:14px;opacity:1}
body:is(.lc-service-page,.baby-page) dialog select:not([multiple]){
 appearance:none;padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23697661' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.4' d='m4 6 4 4 4-4'/%3E%3C/svg%3E");
 background-repeat:no-repeat;background-position:right 14px center;
}
body:is(.lc-service-page,.baby-page) dialog textarea{min-height:110px;resize:vertical}
body:is(.lc-service-page,.baby-page) dialog label:has(>input:is([type=checkbox],[type=radio])){
 display:flex;align-items:flex-start;gap:10px;min-height:44px;
 padding-block:10px;margin-block:12px;font-size:14px;font-weight:400;
}
body:is(.lc-service-page,.baby-page) dialog input:is([type=checkbox],[type=radio]){
 flex:0 0 19px;width:19px;min-width:19px;height:19px;min-height:19px;
 margin:2px 0 0;padding:0;accent-color:#53664b;
}
body:is(.lc-service-page,.baby-page) dialog :is(.formgrid,.formrow,.baby-form-grid){gap:0 16px}
body:is(.lc-service-page,.baby-page) dialog form>p:not(.error):not([role=alert]){
 color:#737a6c;font:400 13px/1.65 system-ui;max-width:60ch;margin:20px 0;
}
body:is(.lc-service-page,.baby-page) dialog form>button:not([type=button]):not(.secondary):not(.danger):not(.destructive){
 display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;
 padding:13px 20px;margin:24px 0 0;border:1px solid #53664b;border-radius:12px;
 background:#53664b;color:#fff;font:500 15px/1.4 system-ui;letter-spacing:.01em;
 box-shadow:0 4px 10px #3440310d;
}
body:is(.lc-service-page,.baby-page) dialog :is(button,a,input,select,textarea,summary):focus-visible{outline:2px solid #8f6d7a;outline-offset:3px}
body:is(.lc-service-page,.baby-page) dialog input[aria-invalid=true],
body:is(.lc-service-page,.baby-page) dialog select[aria-invalid=true],
body:is(.lc-service-page,.baby-page) dialog textarea[aria-invalid=true]{border-color:#a14f46}
body:is(.lc-service-page,.baby-page) dialog :is(.error,[data-service-field-feedback]){font:400 12px/1.5 system-ui;color:#984a40;margin:8px 0}
body:is(.lc-service-page,.baby-page) dialog .error:empty{display:none}
@media(max-width:650px){
 body:is(.lc-service-page,.baby-page) dialog,
 body.lc-service-page dialog.service-start-panel[open]{
 inset:0;width:calc(100% - 24px);max-width:560px;height:fit-content;max-height:calc(100dvh - 24px);
 margin:auto;padding:28px 22px max(24px,env(safe-area-inset-bottom));
 border:1px solid #e4ded4;border-radius:20px;
 }
 body.lc-service-page dialog.service-start-panel::backdrop{background:#252d285c}
 body:is(.lc-service-page,.baby-page) dialog :is(h1,h2){font-size:29px;margin-bottom:22px;padding-right:12px}
 body:is(.lc-service-page,.baby-page) dialog :is(.formgrid,.formrow,.baby-form-grid){grid-template-columns:minmax(0,1fr)}
}
@media(prefers-reduced-motion:reduce){body:is(.lc-service-page,.baby-page) dialog :is(input,select,textarea){transition:none}}
@media(forced-colors:active){
 body:is(.lc-service-page,.baby-page) dialog{border-color:CanvasText}
 body:is(.lc-service-page,.baby-page) dialog select:not([multiple]){appearance:auto;background-image:none}
}