@import "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700&display=swap";
:root{--font-family:"Plus Jakarta Sans", system-ui, -apple-system, sans-serif;--bg-primary:#f1f5f9;--bg-secondary:#ffffffbf;--bg-tertiary:#e2e8f0;--text-primary:#0f172a;--text-secondary:#475569;--text-muted:#94a3b8;--primary:#4f46e5;--primary-hover:#4338ca;--primary-glow:#4f46e51f;--success:#10b981;--success-hover:#059669;--success-glow:#10b9811f;--warning:#f59e0b;--danger:#ef4444;--border-color:#94a3b8;--shadow-sm:0 1px 2px 0 #00000005;--shadow-md:0 8px 30px #0000000a;--shadow-lg:0 20px 40px #0000000f;--radius-sm:8px;--radius-md:12px;--radius-lg:20px;--sidebar-width:260px;--header-height:70px;--glass-bg:#ffffffe6;--glass-border:#94a3b8}[data-theme=dark]{--bg-primary:#030712;--bg-secondary:#111827b3;--bg-tertiary:#1f2937;--text-primary:#f9fafb;--text-secondary:#9ca3af;--text-muted:#4b5563;--primary:#6366f1;--primary-hover:#4f46e5;--primary-glow:#6366f133;--success:#10b981;--success-hover:#059669;--success-glow:#10b98133;--warning:#fbbf24;--danger:#f87171;--border-color:#4b5563;--shadow-sm:0 1px 2px 0 #0000004d;--shadow-md:0 8px 30px #00000059;--shadow-lg:0 20px 40px #00000073;--glass-bg:#111827d9;--glass-border:#4b5563}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-primary);background-image:radial-gradient(at 0% 0%, var(--primary-glow) 0px, transparent 50%), radial-gradient(at 100% 100%, var(--success-glow) 0px, transparent 50%);color:var(--text-primary);font-family:var(--font-family);-webkit-font-smoothing:antialiased;background-attachment:fixed;font-size:14px;line-height:1.5;transition:background-color .3s,color .3s;overflow-x:hidden}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:99px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}a{color:inherit;text-decoration:none}input,select,textarea,button{font-family:inherit;font-size:inherit}.app-container{min-height:100vh;display:flex}.sidebar{width:var(--sidebar-width);background-color:var(--glass-bg);-webkit-backdrop-filter:blur(20px);border-right:1px solid var(--glass-border);z-index:100;flex-direction:column;padding:28px 20px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:0;bottom:0;left:0}.main-content{margin-left:var(--sidebar-width);flex-direction:column;flex:1;min-width:0;display:flex}.header{height:var(--header-height);background-color:var(--glass-bg);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--glass-border);z-index:90;justify-content:space-between;align-items:center;padding:0 40px;display:flex;position:sticky;top:0}.content-body{flex:1;padding:40px;animation:.4s ease-out fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.brand{align-items:center;gap:14px;margin-bottom:36px;padding:0 8px;display:flex}.brand-logo{border-radius:var(--radius-md);background:linear-gradient(135deg, var(--primary), #818cf8);color:#fff;justify-content:center;align-items:center;width:38px;height:38px;font-size:20px;font-weight:800;transition:transform .3s;display:flex;box-shadow:0 4px 20px #6366f159}.brand:hover .brand-logo{transform:rotate(-10deg)scale(1.05)}.brand-name{letter-spacing:-.5px;background:linear-gradient(135deg, var(--text-primary), var(--text-secondary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:19px;font-weight:800}.nav-list{flex-direction:column;flex:1;gap:8px;list-style:none;display:flex}.nav-item{border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;align-items:center;gap:12px;padding:12px 16px;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.nav-item:before{content:"";background-color:var(--primary);opacity:0;border-radius:99px;width:4px;height:50%;transition:all .2s;position:absolute;top:25%;left:0;transform:scaleY(.3)}.nav-item:hover{background-color:var(--bg-primary);color:var(--text-primary);transform:translate(4px)}.nav-item.active{background-color:var(--primary-glow);color:var(--primary)}.nav-item.active:before{opacity:1;transform:scaleY(1)}.nav-icon{filter:grayscale(.2);font-size:18px}.card{background-color:var(--glass-bg);-webkit-backdrop-filter:blur(16px);border-radius:var(--radius-lg);border:1px solid var(--glass-border);box-shadow:var(--shadow-md);padding:28px;transition:all .3s cubic-bezier(.4,0,.2,1)}.card:hover{box-shadow:var(--shadow-lg);border-color:#6366f133;transform:translateY(-4px)}.grid-cols-4{grid-template-columns:repeat(4,1fr);gap:24px;display:grid}.grid-cols-2{grid-template-columns:repeat(2,1fr);gap:24px;display:grid}@media (max-width:1200px){.grid-cols-4{grid-template-columns:repeat(2,1fr)}}.cms-mobile-toggle-btn{display:none}.cms-sidebar-toggle-btn{display:none!important}@media (max-width:1024px){.cms-sidebar-toggle-btn,.cms-mobile-toggle-btn{display:block!important}.cms-header-right{display:none!important}.sidebar{transform:translate(-100%)}.sidebar.open{box-shadow:10px 0 30px #0003;transform:translate(0)!important}.main-content{margin-left:0}.header{padding:0 16px!important}.content-body{padding:16px!important}.grid-cols-4,.grid-cols-2{grid-template-columns:1fr!important}.cms-translations-layout,.cms-products-main-layout,.cms-references-layout{flex-direction:column!important}.cms-translations-sidebar,.cms-products-list-sidebar,.cms-references-sidebar{z-index:99!important;border:none!important;border-right:1px solid var(--glass-border)!important;background-color:var(--glass-bg)!important;-webkit-backdrop-filter:blur(20px)!important;border-radius:0!important;align-self:stretch!important;width:320px!important;padding:24px!important;transition:transform .3s cubic-bezier(.4,0,.2,1)!important;position:fixed!important;top:0!important;bottom:0!important;left:0!important;transform:translate(-100%)!important;box-shadow:10px 0 30px #0003!important}.cms-translations-sidebar.open,.cms-products-list-sidebar.open,.cms-references-sidebar.open{transform:translate(0)!important}.cms-translations-editor,.cms-products-details-card,.cms-references-content{width:100%!important}.cms-products-editor-inner{flex-direction:column!important}.cms-products-form-col,.cms-products-preview-col{width:100%!important}.cms-products-preview-col{position:static!important}}.form-group{margin-bottom:22px}.form-label{color:var(--text-secondary);letter-spacing:.2px;margin-bottom:8px;font-size:13px;font-weight:600;display:block}.form-control{border-radius:var(--radius-md);border:1px solid var(--border-color);width:100%;color:var(--text-primary);background-color:#00000005;outline:none;padding:12px 16px;transition:all .2s}[data-theme=dark] .form-control{background-color:#ffffff08}.form-control:focus{border-color:var(--primary);background-color:var(--bg-primary);box-shadow:0 0 0 4px var(--primary-glow)}.btn{border-radius:var(--radius-md);cursor:pointer;border:none;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-weight:600;transition:all .25s cubic-bezier(.4,0,.2,1);display:inline-flex;position:relative;overflow:hidden}.btn-primary{background:linear-gradient(135deg, var(--primary), #818cf8);color:#fff;box-shadow:0 4px 14px var(--primary-glow)}.btn-primary:hover{background:linear-gradient(135deg, var(--primary-hover), var(--primary));transform:translateY(-1px);box-shadow:0 6px 20px #6366f159}.btn-primary:active{transform:translateY(0)}.btn-secondary{color:var(--text-primary);border:1px solid var(--border-color);background-color:#ffffff0d}.btn-secondary:hover{background-color:var(--bg-tertiary);border-color:var(--text-muted)}.table-container{border-radius:var(--radius-md);border:1px solid var(--border-color);background-color:#ffffff03;overflow-x:auto}.table{border-collapse:collapse;text-align:left;width:100%}.table th{color:var(--text-secondary);border-bottom:1px solid var(--border-color);text-transform:uppercase;letter-spacing:.5px;background-color:#00000005;padding:8px 16px;font-size:13px;font-weight:700}[data-theme=dark] .table th{background-color:#ffffff05}.table td{border-bottom:1px solid var(--border-color);color:var(--text-primary);padding:8px 16px;transition:background-color .2s}.table tbody tr:nth-child(2n) td{background-color:#00000004}[data-theme=dark] .table tbody tr:nth-child(2n) td{background-color:#ffffff04}.table tr:last-child td{border-bottom:none}.table tr:hover td{background-color:#6366f10f!important}.stat-card{justify-content:space-between;align-items:center;display:flex}.stat-value{letter-spacing:-1px;margin-top:6px;font-size:30px;font-weight:800}.stat-icon{border-radius:var(--radius-md);justify-content:center;align-items:center;width:52px;height:52px;font-size:26px;transition:transform .3s;display:flex}.stat-card:hover .stat-icon{transform:scale(1.1)rotate(6deg)}.theme-toggle{cursor:pointer;color:var(--text-secondary);border-radius:var(--radius-md);border:none;border:1px solid var(--border-color);background:0 0;background-color:var(--bg-secondary);justify-content:center;align-items:center;width:42px;height:42px;font-size:20px;transition:all .2s;display:flex}.theme-toggle:hover{background-color:var(--bg-tertiary);color:var(--text-primary);transform:scale(1.05)}.grid-cols-3{grid-template-columns:repeat(3,1fr);gap:24px;display:grid}.two-column-layout{grid-template-columns:300px 1fr;align-items:start;gap:32px;display:grid}.master-detail-layout{grid-template-columns:420px 1fr;align-items:stretch;gap:24px;display:grid}.master-detail-left{flex-direction:column;height:100%;max-height:82vh;display:flex;overflow-y:auto}.master-detail-right{flex-direction:column;min-width:0;height:100%;display:flex}.mobile-menu-toggle{border:1px solid var(--border-color);background:0 0;background-color:var(--bg-secondary);color:var(--text-primary);border-radius:var(--radius-md);cursor:pointer;justify-content:center;align-items:center;width:42px;height:42px;font-size:20px;transition:all .2s;display:none}.sidebar-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:95;background-color:#00000080;animation:.2s ease-out fadeIn;display:none;position:fixed;inset:0}@media (max-width:1200px){.grid-cols-3{grid-template-columns:repeat(2,1fr)}}@media (max-width:992px){.two-column-layout,.master-detail-layout{grid-template-columns:1fr}.master-detail-left{height:auto;max-height:none}}@media (max-width:1024px){.sidebar{width:280px;box-shadow:var(--shadow-lg);transform:translate(-100%)}.sidebar.open{transform:translate(0)}.main-content{margin-left:0}.header{padding:0 20px}.content-body{padding:24px 16px}.grid-cols-4,.grid-cols-3,.grid-cols-2{grid-template-columns:1fr;gap:16px}.mobile-menu-toggle{display:flex}.sidebar-overlay.active{display:block}}.invoice-frame{border:1px solid #ffffff14;border-top:4px solid var(--primary);border-radius:var(--radius-md);box-shadow:inset 0 0 30px #ffffff03, var(--shadow-sm);background:#ffffff05;padding:28px;transition:all .3s;position:relative;overflow:hidden}[data-theme=light] .invoice-frame{border:1px solid #0000000f;border-top:4px solid var(--primary);box-shadow:inset 0 0 30px #00000001, var(--shadow-sm);background:#ffffffe6}.invoice-frame:before{content:"";background:linear-gradient(180deg, var(--primary-glow) 0%, transparent 100%);pointer-events:none;opacity:.5;height:100px;position:absolute;top:0;left:0;right:0}input::-webkit-outer-spin-button{appearance:none;margin:0}input::-webkit-inner-spin-button{appearance:none;margin:0}input[type=number]{appearance:textfield}.sidebar-list{flex-direction:column;gap:8px;max-height:600px;padding-right:4px;display:flex;overflow-y:auto}.sidebar-item{border-radius:var(--radius-md);width:100%;color:var(--text-primary);background-color:var(--bg-secondary);border:1px solid var(--border-color);cursor:pointer;text-align:left;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;font-size:13px;font-weight:500;line-height:1.4;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.sidebar-item:hover{background-color:var(--bg-tertiary);border-color:var(--text-muted);transform:translate(4px)}.sidebar-item.active{border-color:var(--primary);color:var(--primary);background:linear-gradient(135deg,#6366f114 0%,#818cf814 100%);font-weight:600;box-shadow:0 4px 12px #6366f10d}.sidebar-item .item-title{word-break:break-word;flex:1}.sidebar-item .item-indicator{flex-shrink:0;font-size:14px}.cms-translations-layout,.cms-products-main-layout,.cms-references-layout{align-items:start;gap:24px;width:100%;display:flex}.cms-translations-sidebar,.cms-products-list-sidebar,.cms-references-sidebar{flex-shrink:0;align-self:start;position:sticky;top:90px;width:320px!important}.cms-translations-editor,.cms-products-details-card,.cms-references-content{flex:1;min-width:0}.cms-products-editor-inner{align-items:start;gap:28px;display:flex}.cms-products-form-col{flex:1;min-width:0}.cms-products-preview-col{flex-shrink:0;width:380px;position:sticky;top:90px}.sidebar-list{max-height:calc(100vh - 270px)!important}.toast-container{z-index:100000;pointer-events:none;flex-direction:column;gap:12px;display:flex;position:fixed;bottom:24px;right:24px}.toast{pointer-events:auto;background-color:var(--glass-bg,#ffffffe6);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border,var(--border-color,#e2e8f0));border-radius:var(--radius-md,12px);min-width:320px;max-width:480px;box-shadow:var(--shadow-lg,0 20px 40px #0000000f);align-items:flex-start;gap:14px;padding:16px 20px;transition:all .3s;animation:.35s cubic-bezier(.16,1,.3,1) forwards toastSlideIn;display:flex}.toast.toast-exit{animation:.3s forwards toastSlideOut}.toast-success{border-left:4px solid var(--success,#10b981)}.toast-error{border-left:4px solid var(--danger,#ef4444)}.toast-info{border-left:4px solid var(--primary,#4f46e5)}.toast-icon{flex-shrink:0;margin-top:2px;font-size:20px}.toast-content{flex-direction:column;flex:1;gap:4px;display:flex}.toast-message{color:var(--text-primary,#0f172a);white-space:pre-line;font-size:13px;font-weight:500;line-height:1.4}.toast-close{color:var(--text-muted,#94a3b8);cursor:pointer;background:0 0;border:none;padding:2px;font-size:14px;transition:color .2s}.toast-close:hover{color:var(--text-primary,#0f172a)}@keyframes toastSlideIn{0%{opacity:0;transform:translateY(100px)scale(.9)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes toastSlideOut{0%{opacity:1;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(30px)scale(.9)}}
