/* *****************************************************

    ** Custom Stylesheet **

    Any custom styling you want to apply should be
    defined here.

***************************************************** */

/* Custom CSS for Nexus Theme
 *
 * This file allows you to customize the theme colors and styles for the entire Nexus template.
 *
 * To customize colors:
 * - Replace the var() references with your own hex colors or other CSS values.
 * - For example, instead of --primary: #4b5563; use --primary: #your-color;
 * - You can also override any CSS properties here.
 */

:root {
  body { font-family: Inter, sans-serif; background: #f8fafc; margin:0; }

.hx-header {
    display:flex; justify-content:space-between; align-items:center;
    background:#0f172a; color:#fff; padding:10px 20px;
}
.hx-nav a { color:#fff; margin:0 10px; text-decoration:none; }
.hx-user a { color:#fff; margin-left:10px; text-decoration:underline; }

.hx-user-dropdown { position: relative; display:inline-block; cursor:pointer; }
.hx-user-dropdown span { padding:5px 10px; background:#2563eb; border-radius:8px; }
.hx-dropdown-content {
    display:none; position:absolute; right:0; background:#fff; min-width:180px; border-radius:8px;
    box-shadow:0 8px 24px rgba(0,0,0,.15); z-index:1000;
}
.hx-dropdown-content a { color:#0f172a; padding:10px 15px; text-decoration:none; display:block; }
.hx-dropdown-content a:hover { background:#f1f5f9; }
.hx-user-dropdown:hover .hx-dropdown-content { display:block; }

.hx-dashboard { padding:20px; }
.hx-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.hx-card, .hx-service-card, .hx-domain-card, .hx-ticket-card, .hx-invoice-card, .hx-cart-card {
    background:#fff; padding:20px; border-radius:14px; box-shadow:0 8px 24px rgba(0,0,0,.05); margin-bottom:20px;
}
.hx-btn { display:inline-block; margin-top:12px; padding:10px 16px; background:#2563eb; color:#fff; border-radius:8px; text-decoration:none; }

.hx-auth-card { max-width:400px; margin:50px auto; background:#fff; padding:30px; border-radius:16px; box-shadow:0 12px 36px rgba(0,0,0,.1); }
.hx-auth-card input { width:100%; padding:12px; margin:10px 0; border-radius:8px; border:1px solid #ddd; }

.hx-cart-grid { display:flex; gap:20px; flex-wrap:wrap; }
.hx-cart-items { flex:3; }
.hx-cart-summary { flex:1; background:#fff; padding:20px; border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,.05); position:sticky; top:20px; }
