/* V37: screen-only control colours, focus spacing and dashboard alignment. */
@media screen {
/* Higher specificity also covers the legacy input-type and focus rules. */
#root :where(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),select,textarea){border:1px solid #e0a5be!important;caret-color:#c22064}
#root :where(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),select,textarea):focus{border:2px solid #ba2765!important;outline:0!important;box-shadow:0 0 0 3px rgba(186,39,101,.15)!important}
#root :is(button,a,input,select,textarea):focus-visible{outline:3px solid #ba2765!important;outline-offset:3px}
#root .app-shell :is(.inline-search,.sale-search,.global-search){border-color:#e0a5be!important}
#root .app-shell :is(.inline-search,.sale-search,.global-search):focus-within{border:2px solid #ba2765!important;box-shadow:0 0 0 3px rgba(186,39,101,.15)!important}
#root .app-shell :is(.inline-search,.sale-search,.global-search)>input,
#root .app-shell :is(.inline-search,.sale-search,.global-search)>input:focus{border:0!important;outline:0!important;box-shadow:none!important}
#root .hardware-login .login-card label>div{border:1px solid #e0a5be!important;gap:8px!important}
#root .hardware-login .login-card label>div:focus-within{border:1px solid #ba2765!important;box-shadow:0 0 0 3px rgba(186,39,101,.15)!important}
#root .hardware-login .login-card input,
#root .hardware-login .login-card input:focus,
#root .hardware-login .login-card input:focus-visible{border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;min-height:0!important;height:44px!important;box-sizing:border-box!important;padding:8px 10px!important;border-radius:6px!important;line-height:1.5!important;caret-color:#c22064}
#root .hardware-login .login-card label>div>svg{flex:0 0 21px!important}
#root .hardware-login .password-toggle:focus-visible{outline:2px solid #ba2765!important;outline-offset:1px}

/* Selected: dark blue / white. Available: light blue / dark blue. */
#root .app-shell :is(.settings-nav,.product-mode,.price-mode-buttons,.gstr-tabs,.chips) button:not(.active){background-image:linear-gradient(180deg,#fcf0f5,#f8e3ec)!important;background-color:#faeaf1!important;border-color:#e8b5ca!important;color:#7e2047!important;box-shadow:inset 0 1px 0 #fff,0 2px 6px rgba(129,33,73,.10)!important;text-shadow:none!important;font-weight:750!important}
#root .app-shell :is(.settings-nav,.product-mode,.price-mode-buttons,.gstr-tabs,.chips) button.active{background-image:linear-gradient(180deg,#a81b56,#851645)!important;background-color:#8f1749!important;border-color:#7f1542!important;color:#fff!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 3px 8px rgba(133,22,69,.18)!important;text-shadow:none!important;font-weight:800!important}
#root .app-shell :is(.settings-nav,.product-mode,.price-mode-buttons,.gstr-tabs,.chips) button:not(.active):hover{border-color:#ba2765!important;background-color:#f7dde8!important;background-image:linear-gradient(180deg,#faeaf1,#f6d8e5)!important}
#root .app-shell :is(.settings-nav,.product-mode,.price-mode-buttons,.gstr-tabs,.chips) button svg{color:currentColor!important;stroke:currentColor!important}
#root .app-shell :is(.theme-options,.language-options)>button:not(.selected){background:#fbeef3!important;border-color:#e8b5ca!important;color:#7e2047!important;box-shadow:inset 0 1px #fff!important}
#root .app-shell :is(.theme-options,.language-options)>button.selected{background:linear-gradient(180deg,#a81b56,#851645)!important;border-color:#7f1542!important;color:#fff!important;box-shadow:inset 3px 0 #efa0c1!important}
#root .app-shell :is(.theme-options,.language-options)>button.selected :is(small,svg){color:#fbecf2!important}
#root .app-shell .price-mode-bar,#root .app-shell .product-pricing{border-color:#e7afc7!important;background:linear-gradient(145deg,#fef9fb,#fcf0f5)!important}
#root .app-shell .pricing-title b{color:#7e2047!important}
#root .app-shell .send-products-toggle input:checked+i{background:linear-gradient(135deg,#cc3776,#a81b56)!important}

/* Blue product highlights and action accents; existing motion is inherited. */
#root .app-shell .product-card{border-color:#e5b0c6!important}
#root .app-shell .product-card:hover{border-color:#ba2765!important;box-shadow:0 8px 22px rgba(186,39,101,.17)!important}
#root .app-shell .product-card.keyboard-active{border:2px solid #ba2765!important;box-shadow:0 0 0 3px rgba(186,39,101,.16),0 8px 22px rgba(129,33,73,.16)!important}
#root .app-shell .product-card>i{background:linear-gradient(145deg,#d22970,#a81b56)!important;color:#fff!important;box-shadow:0 2px 6px rgba(168,27,86,.16)!important}
#root .app-shell .product-card strong em{color:#982254!important}
#root .app-shell .text-btn{color:#a81b56!important;font-weight:750!important}
#root .app-shell .text-btn:hover{color:#7f1542!important;background:#faebf1!important}
#root .app-shell .customer-options button:is(:hover,:focus){outline-color:#ba2765!important;background:#fbeef3!important}
#root .app-shell :is(.saved-access-list>button,.saved-user-edit):hover{border-color:#ba2765!important;background-color:#fbeef3!important}
#root .app-shell :is(.report-products .card-head>svg,.access-panel .section-title h2 svg,.chart-empty svg,.chart-collection){color:#ba2765!important}
#root .app-shell .purchase-balance span{background:#fcf2f6!important;border-color:#e8b5ca!important}
#root .app-shell .ledger-party-card{border-left-color:#bc366e!important}
#root .app-shell .sidebar nav a:hover{box-shadow:inset 3px 0 #ef9fc1!important}
#root .app-shell :is(.btn.primary,.settings-submit,.bill-save-row button:last-child,.save-sale,.header-actions>.language){box-shadow:inset 0 1px rgba(255,255,255,.35),0 3px 9px rgba(168,27,86,.18)!important}
#root .print-preview-print{background:linear-gradient(180deg,#c22064,#a81b56)!important;border-color:#a81b56!important;color:#fff!important}

/* Dashboard titles and subtitles clear the rounded card edges. */
#root .app-shell .dashboard-grid>.card:not(.chart-card)>.card-head{padding:17px 18px 14px!important;margin:0!important;gap:14px;align-items:flex-start}
#root .app-shell .dashboard-grid>.card:not(.chart-card)>.card-head>div{min-width:0}
#root .app-shell .dashboard-grid>.card:not(.chart-card)>.card-head h2{margin:0 0 6px!important;line-height:1.4}
#root .app-shell .dashboard-grid>.card:not(.chart-card)>.card-head p{line-height:1.5!important;overflow-wrap:anywhere}
#root .app-shell .dashboard-grid>.card:not(.chart-card)>.card-head>.text-btn{flex-shrink:0;align-self:flex-start;line-height:1.5;padding:2px 0}
/* The title is translated; the first header action is always the theme button. */
#root .app-shell .header-actions>button.icon:first-child,
#root .app-shell .header-actions>button[title="Theme"],
#root .app-shell .header-actions>button[title="தோற்றம்"]{display:none!important}
@media(max-width:600px){#root .app-shell .dashboard-grid>.card:not(.chart-card)>.card-head{padding:15px!important;gap:10px;flex-wrap:wrap}}
}