/* Distrifarmac / shared visual system. Content and existing actions stay intact. */
:root{--df-navy:#102c4c;--df-blue:#175eac;--df-cyan:#1da6b3;--df-magenta:#bd3988;--df-bg:#f4f7fb;--df-muted:#566e84;--df-edge:#dce5ee;--df-shadow:0 8px 30px #153b6010;--df-ease:cubic-bezier(.22,1,.36,1);--ink:var(--df-navy);--muted:var(--df-muted);--line:var(--df-edge)}
html{scroll-padding-top:100px}
body,body.admin-mode,body.client-mode{font-family:"Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,Arial,sans-serif;color:var(--df-navy);background:var(--df-bg);-webkit-font-smoothing:antialiased;line-height:1.55}
body :is(button,input,select,textarea){font-family:inherit}
body :is(h1,h2,h3,h4){font-family:inherit;text-wrap:balance;letter-spacing:-.035em}
body h1{font-weight:800;line-height:1.13}
body h2{font-weight:750;line-height:1.22}
body p{line-height:1.65}
body :is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid #1295ab;outline-offset:3px}
body :is(button,a){-webkit-tap-highlight-color:transparent}
body :is(button,.button){touch-action:manipulation}
body button:disabled{opacity:.5;cursor:wait;transform:none!important;box-shadow:none!important}
body .button,body.admin-mode .button{min-height:44px;border-radius:12px;font-size:13px;font-weight:750;letter-spacing:-.01em;gap:9px;padding:11px 18px;transition:background .18s,border-color .18s,box-shadow .2s,transform .2s var(--df-ease)}
body .button.primary,body.admin-mode .button.primary{background:linear-gradient(115deg,#185eb0,#15778e);border:1px solid #1d699f;box-shadow:0 4px 12px #14679b20,inset 0 1px #ffffff20;color:#fff}
body .button.primary:hover,body.admin-mode .button.primary:hover{background:linear-gradient(115deg,#154e98,#126b80);box-shadow:0 7px 18px #14679b30;transform:translateY(-1px)}
body .button.outline,body.admin-mode .button.outline{border:1px solid #cddbe6;background:#fff;color:#214b71;box-shadow:0 2px 3px #102b4404}
body .button.outline:hover,body.admin-mode .button.outline:hover{background:#eff7fb;border-color:#79adbf;transform:translateY(-1px)}
body .button.plain{color:#205580;border-radius:10px}
body .button:active,body.admin-mode .button:active{transform:translateY(1px);box-shadow:none}
body :is(input,select,textarea),body.admin-mode :is(input,select,textarea){border:1px solid #cddae6;border-radius:11px;background:#fbfcfe;color:#183c59;min-height:44px;font-size:14px;font-weight:450;transition:border-color .18s,box-shadow .18s;background-clip:padding-box}
body :is(input,select,textarea):focus,body.admin-mode :is(input,select,textarea):focus{border-color:#2399ae;box-shadow:0 0 0 3px #1ca6b315;background:#fff}
body :is(input[type=checkbox],input[type=radio]){min-height:0;width:18px;height:18px;accent-color:#19769c;flex-shrink:0}
body textarea{resize:vertical;line-height:1.65}
body label{font-size:13px;font-weight:650;color:#26485f}
body ::placeholder{color:#7c8ea0;font-weight:400}
body .eyebrow{font-size:10px;letter-spacing:.15em;font-weight:800;color:#257e92}
body .helper{color:#60748a;font-size:12px;line-height:1.6}
body .panel,body.admin-mode .panel,body .stat,body.admin-mode .stat{background:#fff;border:1px solid var(--df-edge);border-radius:18px;box-shadow:var(--df-shadow)}
body :is(.data-table,.order-total,.product-price,.stat strong,.cart-summary){font-variant-numeric:tabular-nums}
body .table-wrap,body.admin-mode .table-wrap{border:1px solid #e1e9f0;border-radius:13px;background:#fff;scrollbar-width:thin}
body .data-table{font-size:13px}
body .data-table th,body.admin-mode .data-table th{padding:14px 16px;background:#f2f6fa;color:#557087;font-size:10px;font-weight:800;letter-spacing:.07em}
body .data-table td,body.admin-mode .data-table td{padding:16px;border-color:#e9eef4;color:#284761}
body .data-table tr:last-child td{border-bottom:0}
body .data-table tbody tr{transition:background-color .15s}
body .data-table tbody tr:hover,body.admin-mode .data-table tbody tr:hover{background:#f5fafd}
body .pill{border-radius:7px;padding:5px 9px;font-size:10px;letter-spacing:.01em}
body .toolbar,body.admin-mode .toolbar{padding:14px;background:#fff;border:1px solid var(--df-edge);border-radius:15px;box-shadow:0 3px 14px #143e6307}
body .modal,body .drawer{background:#f7f9fc;border:1px solid #ffffff90;box-shadow:0 30px 100px #0b244952}
body .modal{border-radius:24px}
body .modal::backdrop,body .drawer::backdrop{background:#0b244957;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
body .close{width:38px;height:38px;background:#eaf0f7;color:#2a506e;border:1px solid #dce5ef;transition:background .18s,transform .18s}
body .close:hover{background:#dceaf4;transform:rotate(8deg)}
body .notice{background:#12334f;border:1px solid #326681;border-radius:14px;box-shadow:0 10px 34px #0e345838;animation:df-enter .24s var(--df-ease)}
body .notice.error{background:#7f2c48;border-color:#a24c68}
body .info-box{border-radius:12px;border-color:#cedfe9;background:#eef6fb;color:#315e7a}
body .empty-state{border-color:#cbdce8;background:#fff;border-radius:18px}
body .notification-bell{width:44px;height:44px;border-radius:13px;border-color:#dbe5ef;background:#fff;box-shadow:0 3px 9px #1c426208}
body .notification-panel{border-radius:18px;border:1px solid #dce7ef;box-shadow:0 20px 65px #12365225}

/* Public entrance: one focal image, quiet secondary surfaces. */
body:not(.admin-mode):not(.client-mode) .header{background:#ffffffed;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 3px 18px #203f6306;border-bottom:1px solid #e4eaf1}
body .topline{background:#133d70;font-size:11px;letter-spacing:.01em}
body .header nav a{position:relative;font-size:13px;font-weight:650;color:#31516f;transition:color .18s}
body .header nav a:hover{color:#087f9a}
body .header nav a::after{content:"";position:absolute;bottom:-9px;left:0;right:0;height:2px;background:#1ba6b3;transform:scaleX(0);transform-origin:left;transition:transform .24s var(--df-ease)}
body .header nav a:hover::after{transform:scaleX(1)}
body #publicView{background:radial-gradient(ellipse at 50% 0,#edf6fc 0,transparent 48%),#f9fbfe}
body #publicView .campaign-section{padding-top:36px;padding-bottom:38px}
body .campaign-intro h1{font-size:clamp(26px,2.65vw,39px);line-height:1.17;font-weight:800}
body .campaign-intro>p{font-size:13px;color:#63778c}
body .campaign-aside{background:#ffffffb8;border-color:#dfe8f1;border-radius:18px;box-shadow:0 8px 28px #224e6b08;padding:24px 21px}
body .campaign-aside h2{font-weight:750;font-size:22px;line-height:1.22}
body .campaign-access{background:linear-gradient(150deg,#eff8fc,#fff);border-top:3px solid #219bad}
body .campaign-assurance{border-top:3px solid #c1428b}
body .campaign-assurance li{padding:17px 0}
body .campaign-assurance strong{font-size:12px}
body .campaign-assurance small{font-size:12px;color:#607489}
body .campaign-access>button{min-height:44px;border-radius:10px;font-size:12px}
body #publicView .campaign-main{border-radius:18px;box-shadow:0 14px 38px #13385910;overflow:hidden}
body .campaign-controls{padding:11px 14px;background:#fff}
body .campaign-controls>button{width:36px;height:36px;transition:background .18s,transform .18s}
body .campaign-controls>button:hover{background:#edf6fb;transform:scale(1.06)}
body .campaign-pages span{border-radius:6px;transition:background .3s}
body .campaign-shortcuts button{min-height:54px;border-radius:12px;background:#fff;box-shadow:0 3px 14px #15395c05}
body .steps article{background:#fff;border:1px solid #e0e8ef;border-radius:20px;box-shadow:0 8px 28px #18385d07;transition:transform .25s var(--df-ease),box-shadow .25s}
body .steps article:hover{transform:translateY(-3px);box-shadow:0 14px 30px #18385d12}
body .steps h3{font-size:20px}
body .steps p{font-size:14px}
body .faq details{border-color:#dce7ef;padding-block:18px}
body .faq summary{font-size:16px;color:#204561}
body .footer{background:linear-gradient(145deg,#edf5fb,#f5f8fc);border-top:1px solid #dae6f0}
body .footer h3{font-size:16px;letter-spacing:-.02em}
body .footer a{overflow-wrap:anywhere}

/* Workspace chrome shared by client and administrator. */
body:is(.admin-mode,.client-mode) .admin-sidebar{background:radial-gradient(ellipse at 0 0,#1e577750,transparent 65%),linear-gradient(165deg,#112b48,#0e233e);border-right:1px solid #203b57;box-shadow:8px 0 28px #0d274708}
body:is(.admin-mode,.client-mode) .admin-brand{padding-block:24px;border-color:#accde41a}
body:is(.admin-mode,.client-mode) .admin-brand-mark{background:linear-gradient(135deg,#1a6a94,#234673);border:1px solid #528da27a;box-shadow:inset 0 1px #ffffff20,0 6px 18px #07162b30;border-radius:13px}
body:is(.admin-mode,.client-mode) .admin-nav-group>p{font-size:9px;letter-spacing:.16em;color:#8ca9c3;font-weight:750;margin-bottom:10px}
body:is(.admin-mode,.client-mode) .admin-nav-group button{min-height:46px;border-radius:11px;color:#c4d7e8;font-size:12px;transition:background .2s,border-color .2s,transform .2s var(--df-ease);margin-bottom:4px}
body:is(.admin-mode,.client-mode) .admin-nav-group button:hover{color:#fff;background:#a1d9f00f;transform:translateX(2px)}
body:is(.admin-mode,.client-mode) .admin-nav-group button.active{background:linear-gradient(105deg,#237b9960,#27517455);border-color:#61b3ca50;box-shadow:inset 3px 0 #5bd0db,0 6px 16px #05152610;color:#edfdff}
body:is(.admin-mode,.client-mode) .admin-sidebar-footer{background:#081c3125;border-color:#accde41a}
body:is(.admin-mode,.client-mode) .admin-profile{line-height:1.5}
body:is(.admin-mode,.client-mode) .admin-signout{min-height:42px;border-radius:10px;border-color:#829fb64d;color:#dcebf6;font-size:12px}
body:is(.admin-mode,.client-mode) .admin-topbar{background:#f4f7fbed;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-color:#dfe7ef;height:68px}
body:is(.admin-mode,.client-mode) .workspace-crumb{font-size:12px}
body:is(.admin-mode,.client-mode) .workspace-heading h1{font-size:clamp(27px,2.5vw,37px);font-weight:800;letter-spacing:-.045em}
body.admin-mode:has(.agreement-shell) .workspace-heading{display:none}
body.admin-mode:has(.agreement-shell) .agreement-shell{padding-top:26px}
body:is(.admin-mode,.client-mode) .workspace-heading>div>p{font-size:14px;color:#5c7389}
body.admin-mode[data-admin-view=resumen] .workspace-heading>div>p{color:#d3e7f1}
body #workspaceContent>*,body .agreement-shell{animation:df-enter .32s var(--df-ease) both}
body .admin-shortcut,body.admin-mode .admin-shortcut{border-radius:15px}
body .alert-card,body.admin-mode .alert-card{border-radius:13px;background:linear-gradient(155deg,#fff,#f5f9fc);padding:18px;border-color:#dde8ef}
body .alert-card p,body.admin-mode .alert-card p{font-size:12px}
body .stat strong,body.admin-mode .stat strong{font-size:32px;letter-spacing:-.045em}
body .stat small,body.admin-mode .stat small{font-size:12px}
body .order-card{border-radius:18px;border-color:#dce6ef;box-shadow:0 5px 24px #163e6209}
body .order-card h3{font-size:18px}
body .order-card p{font-size:13px}
body .order-footer{border-color:#e5ecf3}
body .benefit-tabs button{border-radius:10px;min-height:42px;font-size:12px;font-weight:650;transition:background .18s}
body .benefit-card{border-radius:18px;box-shadow:0 6px 24px #203c5a0b}
body .benefit-hero{border-radius:22px}
body .product-card{border-radius:17px;box-shadow:0 4px 18px #24445f08;border-color:#dce6ef;transition:transform .24s var(--df-ease),box-shadow .24s,border-color .24s}
body .product-card:hover{transform:translateY(-3px);box-shadow:0 14px 32px #1f476016;border-color:#9cc5d7}
body .product-card h3{font-size:13px;font-weight:750;letter-spacing:-.015em;line-height:1.5;text-wrap:initial}
body .product-body{padding:18px;gap:9px}
body .product-price{font-size:24px;font-weight:800;letter-spacing:-.04em}
body .product-unit{font-size:12px}
body .product-buy input{border-radius:10px;min-height:44px}
body .product-buy .button{border-radius:10px;font-size:12px;padding-inline:12px}
body .product-card.coin-product-card{border-color:#c39a3d}
body :is(.workspace-heading h1,.workspace-heading h2,.stat strong,.product-price){font-family:inherit}
body .cart-line{border-radius:16px}
body .cart-line h3{font-size:14px;font-weight:750;line-height:1.5}
body .cart-line .button{min-height:38px}
body .drawer-head h2{font-size:31px}
body .cart-summary{border-radius:16px}
body .purchase-heading h2{font-size:26px}
body .purchase-list-row{border-radius:14px;min-height:78px;padding:18px 22px;transition:transform .18s,border-color .18s,box-shadow .18s}
body .purchase-list-row:hover{transform:translateY(-1px);box-shadow:0 7px 22px #204b7210}
body .purchase-list-row strong{font-size:14px}
body .purchase-list-row small{font-size:12px}
body .purchase-overview>div,body .purchase-summary>div{border-radius:16px}
body .purchase-empty{padding:40px 24px;background:linear-gradient(140deg,#fff,#f2f8fc)}
body .purchase-status{border-radius:8px;font-size:11px}
@keyframes df-enter{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1100px){body .campaign-layout{gap:16px}body .campaign-aside{padding:19px 16px}body .campaign-aside h2{font-size:20px}}
@media(max-width:680px){
 body :is(input,select,textarea),body.admin-mode :is(input,select,textarea){font-size:16px}
 body .button,body.admin-mode .button{font-size:13px;min-height:44px;padding:10px 14px}
 body:is(.admin-mode,.client-mode) .admin-topbar{height:62px}
 body .panel,body.admin-mode .panel{border-radius:15px;padding:18px}
 body .product-body{padding:13px}body .product-card h3{font-size:12px}body .product-price{font-size:21px}
 body .campaign-intro h1{font-size:28px}body #publicView .campaign-section{padding-top:25px}
 body .campaign-aside{border-radius:15px}body .campaign-shortcuts{gap:9px}
 body .purchase-list-row{padding:15px;gap:10px}body .purchase-list-row strong{font-size:13px}
 body .purchase-status{font-size:10px}body .drawer{border-radius:20px 0 0 20px}
 body .data-table .button{font-size:12px}body .stat strong,body.admin-mode .stat strong{font-size:27px}
}
@media(prefers-reduced-motion:reduce){body *,body *::before,body *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
