/* COMPLUSSOFT software storefront */
:root{--ink:#14213b;--blue:#235ee8;--line:#e5eaf3}body{background:#f8faff;color:var(--ink);font-family:'Segoe UI',Tahoma,sans-serif}.topbar{background:#112440;color:#dbe7ff;font-size:10px;padding:10px 6%}.topbar span{color:#c5d5ef}header{padding:25px 5%;gap:25px}.logo>span{color:#2865ec}.logo strong{letter-spacing:-.7px;font-size:21px}.logo small{color:#8794ac;font-size:8px;letter-spacing:2.1px}nav a{color:#53617b;font-size:13px}.cartlink{border:1px solid #e2e8f4;border-radius:8px;background:white;padding:11px 14px}.cartlink b{background:#e8f0ff;color:#275cd2}.hero{background:radial-gradient(ellipse at 85% 60%,#d3e4ff 0,transparent 55%),linear-gradient(115deg,#edf3ff,#f1f6ff);padding:50px 45px 30px;min-height:445px;border:1px solid #e6edf9;border-radius:18px}.eyebrow{color:#5075ac;font-size:10px;letter-spacing:1.8px}.eyebrow i{background:#4077ec;box-shadow:0 0 0 4px #dfebff}.hero h1{font-size:40px;line-height:1.5;margin-top:24px;letter-spacing:-1.7px}.hero h1 span{color:#2862db}.hero p{color:#74829a;font-size:12px;line-height:2.1;margin-top:17px;margin-bottom:25px}.button{background:#245de0;box-shadow:0 6px 14px #245de019;padding:14px 21px}.button:hover{background:#1749bd}.hero-secondary{display:inline-block;margin-left:18px;font-size:11px;color:#607394}.hero-meta{font-size:8px;letter-spacing:1.2px;color:#8095b2;margin-top:40px}.hero-art{perspective:1000px}.software-glow{position:absolute;width:310px;height:310px;border-radius:50%;background:#dce9ff;border:1px solid #c4d9ff;box-shadow:0 0 0 28px #e6efff,0 0 0 29px #d4e2fb}.software-box{position:absolute;width:185px;height:260px;border-radius:9px;box-shadow:14px 27px 30px #234c8d25;border:1px solid #fff5;color:white;padding:23px 20px;transform:rotate(-8deg);background:linear-gradient(135deg,#142d6a,#2467e5 60%,#5da8fa);overflow:hidden}.software-box:after,.product-box:after{content:'';position:absolute;inset:0;border-right:10px solid #ffffff1a;border-left:2px solid #ffffff20;pointer-events:none}.box-front{right:38px;top:45px;transform:rotate(9deg);z-index:2}.box-back{left:17px;top:15px;background:linear-gradient(135deg,#8b312b,#d45436 60%,#ed9a60);transform:rotate(-12deg)}.box-brand{font:bold 7px Arial;letter-spacing:1.3px;display:flex;justify-content:space-between}.box-brand span{font-size:5px;opacity:.7}.software-box h3{font:400 24px 'Segoe UI',Arial;margin:22px 0 5px;letter-spacing:-1px}.software-box h3 b{font-weight:300}.software-box p{font:6px Arial;letter-spacing:1.3px;color:#d8e8ff;margin:8px 0}.software-box>small{position:absolute;bottom:17px;font:5px Arial;letter-spacing:1.5px;opacity:.7}.window-icon{width:64px;height:64px;display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-top:42px;transform:perspective(100px) rotateY(-10deg)}.window-icon i{background:#c4e8ff;box-shadow:0 0 20px #adceff33}.office-icon{font:bold 84px Arial;margin:20px 0 0;color:#ffe1d0;letter-spacing:-10px}.digital-label{position:absolute;z-index:3;bottom:5px;right:3px;display:flex;align-items:center;gap:12px;background:white;border:1px solid #e3ebfa;border-radius:10px;padding:14px 19px;box-shadow:0 10px 24px #1b417715;font-size:12px}.digital-label>span{background:#eaf1ff;color:#2f65d6;border-radius:8px;padding:6px 10px;font-size:20px}.digital-label small{display:block;font-size:9px;color:#8b99ae;margin-top:4px}.benefits{color:#667992;border-color:#e4eaf5;font-size:11px;padding:25px 8px}.section-head{margin-top:42px}.section-head h2{font-size:25px}.section-head h2 span{color:#97a3b5;font-size:10px}.chips a{border-color:#e2e8f4;background:white;color:#687992;border-radius:7px}.chips .active{background:#245de0;color:white;border-color:#245de0}.filter>input{border-color:#e2e8f4;max-width:230px}.filter button{background:#edf3ff;color:#2c5fbe;border-color:#e1eafe}.grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.product{border-color:#e5eaf3;border-radius:12px;box-shadow:0 3px 8px #22375903}.product-art{height:210px;background:radial-gradient(at 50% 75%,#e2eafb,#f3f6fc 70%)}.tag{background:white;color:#7f8da6;top:12px;left:12px;padding:5px 8px;font-size:8px;border:1px solid #eaf0f8}.product-box{width:105px;height:143px;margin-top:15px;position:relative;border-radius:4px;box-shadow:8px 13px 14px #273f772a;transform:perspective(700px) rotateY(-16deg) rotate(-7deg);background:linear-gradient(135deg,#173c8b,#3983ef);color:white;padding:14px 11px;overflow:hidden}.product-box .box-brand{font-size:4px;letter-spacing:.8px}.product-symbol{font:54px 'Segoe UI',Arial;margin:10px 0 5px;line-height:1;color:#d6eaff}.product-box>b{font:14px 'Segoe UI',Arial;display:block}.product-box>small{font:4px Arial;letter-spacing:.6px;display:block;margin-top:5px}.theme-1{background:linear-gradient(135deg,#a83224,#eb8054)}.theme-2{background:linear-gradient(135deg,#185b58,#42b4a0)}.theme-3{background:linear-gradient(135deg,#503392,#9865d7)}.product-info{padding:18px}.product-info>small{color:#8b9bb5;font-size:9px}.product h3{font:600 16px 'Segoe UI',Arial;line-height:1.5;min-height:25px;margin:7px 0}.product-info p{font-size:10px;color:#8996ac;line-height:1.7;min-height:34px}.product-bottom{display:block;margin-top:17px}.product-bottom strong{font:600 22px 'Segoe UI',Arial;letter-spacing:-.6px;color:#1e3560}.product-bottom small{font-size:9px;color:#8c9bb0;margin:5px 0}.product-bottom form{margin-top:14px}.add{display:block;width:100%;height:auto;padding:10px 7px;background:#edf3ff;color:#285dc4;border:1px solid #dce7fc;border-radius:6px;font-size:11px;text-align:center}.add:hover{background:#245de0;color:white}.how-it-works{padding:50px 0 12px;text-align:center}.how-it-works>.eyebrow{justify-content:center;font-size:9px}.how-it-works>h2{font-size:26px;margin:14px 0 25px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;text-align:left}.steps article{background:white;border:1px solid #e4eaf5;border-radius:12px;padding:24px}.steps article>b{font:500 28px 'Segoe UI',Arial;color:#a2bbea}.steps h3{font-size:15px;font-weight:600;margin:15px 0 10px}.steps p{color:#8b99ad;font-size:11px;line-height:1.9}.bottom-banner{background:#122a50;color:white;margin-top:30px;padding:28px 32px;border-radius:13px}.bottom-banner small{color:#8da9cf;font-size:8px}.bottom-banner h2{font-size:23px;margin:11px 0 3px}.bottom-banner a{border-color:#526c91;color:#d7e5fa;font-size:11px}.notice{background:#edf3ff;color:#5c789d;border:1px solid #e2ebfb;font-size:11px}footer{border-color:#e2e9f4;background:white}footer .logo{color:#173358}footer p,footer>a:not(.logo),footer small{color:#8c9ab0}.panel{border-color:#e4eaf5}.status{background:#eaf1ff;color:#3c6bc6}.total{border-color:#e1e8f5}.alert{background:#fff3e5}
@media(min-width:1400px){.hero h1{font-size:43px}.box-front{right:55px}.box-back{left:38px}}
@media(max-width:1050px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hero h1{font-size:33px}.hero{padding:35px 25px}.hero-secondary{margin:15px 0 0 14px}.software-box{width:155px;height:225px;padding:18px}.box-front{right:4px;top:55px}.box-back{left:0;top:25px}.software-box h3{font-size:20px}.window-icon{margin-top:30px;width:53px;height:53px}.office-icon{font-size:70px}.digital-label{right:0;bottom:5px;padding:12px}.software-glow{width:240px;height:240px}.product-art{height:200px}}
@media(max-width:700px){header{gap:14px}.logo strong{font-size:19px}.cartlink{padding:9px;font-size:11px}.hero{padding:30px 24px 22px}.hero h1{font-size:32px}.hero p{font-size:11px}.hero-secondary{font-size:10px;margin-left:12px}.hero-art{height:285px}.software-box{width:155px;height:225px}.box-back{left:calc(50% - 145px);top:18px}.box-front{right:calc(50% - 145px);top:40px}.software-glow{width:220px;height:220px}.digital-label{right:calc(50% - 135px);bottom:0;font-size:11px}.hero-meta{margin-top:28px;font-size:6px;gap:10px}.benefits{font-size:9px;gap:17px;padding:23px 0}.section-head{margin-top:30px}.section-head h2{font-size:22px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.product-art{height:175px}.product-box{width:95px;height:130px;padding:12px}.product-symbol{font-size:45px}.product-box>b{font-size:13px}.product-info{padding:13px}.product h3{font-size:15px;min-height:45px}.product-info p{font-size:9px;min-height:48px}.product-bottom strong{font-size:20px}.product-bottom small{font-size:8px}.add{font-size:10px;padding:10px 4px}.section-head h2 span{font-size:10px}.filter>input{max-width:none}.steps{grid-template-columns:1fr;gap:12px}.steps article{padding:20px}.steps article>b{float:left;margin-right:20px;margin-top:10px}.steps h3{margin-top:6px}.steps p{margin-bottom:0}.how-it-works{padding-top:38px}.how-it-works>h2{font-size:23px}.bottom-banner{padding:25px}.bottom-banner h2{font-size:20px}}
.header-line{margin-left:auto;white-space:nowrap;background:#e8f8ef;color:#148847;border:1px solid #cbeedb;border-radius:8px;padding:12px 15px;font-size:12px;font-weight:600}.header-line:hover{background:#d7f3e3}.product-bottom .line-buy{margin-top:14px;background:#08a64e;color:white;border:1px solid #089a49}.product-bottom .line-buy:hover{background:#07813e}.product-details{display:block;font-size:9px;text-align:center;color:#8696af;margin-top:9px}.product-details:hover{color:#235ee8;text-decoration:underline}.line-button{background:#08a64e;box-shadow:none}.line-button:hover{background:#07813e}.line-contact .line-price{font:600 28px 'Segoe UI',sans-serif;color:#245de0}.line-contact>p{font-size:13px;line-height:1.9;color:#7284a0}.line-contact textarea{background:#f6f9ff;font-size:12px;line-height:1.9;resize:vertical;margin-top:9px}.message-label{display:block;font-size:12px;color:#597190;margin-top:25px}.copy-message{font-size:11px;margin-top:10px}.line-contact .line-button{margin-top:10px}.admin-stats .line-stat{font-size:23px;color:#139554}.admin-stats .line-stat span{display:block;margin-top:6px;font:11px Tahoma,sans-serif}.settings-grid>.notice{font-size:11px;line-height:1.9;margin:0}.settings-grid>.notice p{margin:7px 0 0}@media(max-width:700px){.header-line{font-size:10px;padding:10px}.product-bottom .line-buy{font-size:10px}.line-contact{padding:23px}.line-contact h1{font-size:26px}.line-contact h2{font-size:22px}}
/* Readability and touch targets verified during UI audit. */
.product{display:flex;flex-direction:column;min-width:0}.product-info{display:flex;flex-direction:column;flex:1;min-width:0}.product h3{min-height:48px;overflow-wrap:anywhere}.product-info p{color:#65758f;font-size:12px;line-height:1.85;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;min-height:66px}.product-bottom{margin-top:auto;padding-top:12px}.product-bottom small{font-size:11px;color:#58745c}.product-bottom .line-buy,.copy-message{min-height:44px;display:flex;align-items:center;justify-content:center;font-size:12px}.product-details{font-size:11px;padding:7px 0;line-height:1.6}.section-head h2 span{font-size:12px;color:#687b96}.product-info>small{font-size:11px;color:#687b96}.tag{font-size:10px}.steps p{font-size:12px;color:#687b96}.line-contact>p,.line-contact textarea{font-size:14px}.line-contact .notice{font-size:13px;line-height:1.9}.search-summary{font-size:13px;color:#5b6e8b}.search-summary a{margin-left:14px}.muted{color:#687b96;line-height:1.8}.logo strong{max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.grid>.empty{grid-column:1/-1;background:white;border:1px dashed #dce5f3;border-radius:10px}.stack label{font-size:13px}.stack input,.stack select,.stack textarea{font-size:14px}.alert{line-height:1.9}.line-contact textarea{overflow-wrap:anywhere}.product-art img{max-width:100%}@media(max-width:700px){.chips{flex-wrap:wrap;overflow:visible;gap:7px}.chips a{font-size:12px;min-height:40px;padding:10px 13px}.filter{row-gap:12px}.filter>input,.filter>button{min-height:44px;font-size:13px}.product h3{font-size:16px;line-height:1.5;min-height:48px}.product-info p{font-size:11px;min-height:62px;line-height:1.85}.product-bottom small{font-size:10px;line-height:1.7}.product-bottom .line-buy{font-size:11px;padding:11px 4px}.product-details{font-size:10px}.product-info>small{font-size:10px}.section-head h2 span{font-size:12px;line-height:1.8}.header-line{min-height:42px;display:flex;align-items:center;font-size:11px}.logo strong{max-width:190px}nav a{min-height:40px;padding:10px}.hero p{font-size:13px;line-height:2}.hero-secondary{font-size:12px;padding:12px 0}.benefits{font-size:10px;line-height:1.8}.steps p{font-size:13px}.steps h3{font-size:16px}.line-contact .line-price{font-size:27px}.settings-grid>.notice{font-size:12px}.page-heading h1{font-size:32px}.admin-stats strong span{line-height:1.6}.admin-layout .panel{min-width:0}.product-table th,.product-table td{font-size:12px}.product-table td strong{display:block;max-width:220px;white-space:normal;overflow-wrap:anywhere}.settings-grid .stack{min-width:0}}@media(max-width:360px){.logo strong{font-size:17px;max-width:165px}.hero h1{font-size:28px}.hero{padding:25px 20px}.product-info{padding:11px}.product h3{font-size:15px}.product-details{font-size:9px}.product-art{height:155px}}
@media(max-width:700px){header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:20px 5%}header .logo{font-size:29px;gap:8px}header .logo>span{margin-left:-10px}header .logo strong{font-size:17px;max-width:175px}header .logo small{font-size:6px;letter-spacing:1.5px}header .header-line{font-size:10px;padding:9px;min-height:40px;margin-left:0}header nav{grid-column:1/-1;order:initial;justify-content:center;margin:0;gap:18px}header nav a{font-size:12px;padding:10px 5px}.admin-title{align-items:center}.admin-layout .table-scroll{overflow:visible}.product-table,.product-table tbody{display:block;white-space:normal}.product-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.product-table tbody{display:grid;gap:12px}.product-table tbody tr{display:grid;grid-template-columns:1fr 1fr;border:1px solid #e4eaf5;border-radius:9px;padding:12px;background:#fff}.product-table td{border:0;padding:7px 0;min-width:0}.product-table td:first-child{grid-column:1/-1}.product-table td:first-child strong{font-size:14px;max-width:none}.product-table td:nth-child(2)::before{content:'ราคา ';color:#8292aa;font-size:11px}.product-table td:nth-child(3){text-align:right}.product-table td:nth-child(3)::before{content:'คงเหลือ ';color:#8292aa;font-size:11px}.product-table td:last-child{grid-column:1/-1;display:flex;justify-content:flex-end;align-items:center;gap:10px;border-top:1px solid #eef2f9;margin-top:5px;padding-top:10px}.product-table .edit-link,.product-table .inline-form button{display:inline-flex;align-items:center;justify-content:center;min-height:40px;font-size:12px;padding:9px 14px}.product-table .edit-link{background:#edf3ff;border-radius:6px}.product-table .inline-form{margin:0}}
@media(max-width:360px){header .logo strong{font-size:15px;max-width:150px}header .logo{font-size:26px}header .header-line{font-size:9px;padding:8px}header .logo small{font-size:5px;letter-spacing:1px}}
@media(max-width:700px){header .logo{grid-column:1;grid-row:1}header .header-line{grid-column:2;grid-row:1}header nav{grid-column:1/-1;grid-row:2}}
.file-picker{position:relative;display:flex;align-items:center;gap:12px;padding:12px;border:1px solid #dce3ed;border-radius:7px;min-height:52px;background:#f7faff;overflow:hidden}.file-picker-button{background:#e4edff;border-radius:5px;color:#295dc0;padding:8px 12px;white-space:nowrap;font-size:12px}.file-picker-name{font-size:11px;color:#6c7f9b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.file-picker-input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.file-picker:focus-within{outline:3px solid #7daa37;outline-offset:3px}
@media(max-width:360px){.grid{grid-template-columns:1fr}.product-art{height:210px}.product-info{padding:18px}.product h3{font-size:18px;min-height:0}.product-info p{font-size:12px;min-height:0}.product-bottom small{font-size:11px}.product-bottom .line-buy{font-size:12px}.product-details{font-size:11px}}