/* Eina Font Implementation */
    @font-face {
        font-family: 'Eina';
        src: local('Eina'), local('Eina-Regular'); 
        font-weight: normal;
        font-style: normal;
    }
    @font-face {
        font-family: 'Eina';
        src: local('Eina SemiBold'), local('Eina-SemiBold');
        font-weight: 600;
        font-style: normal;
    }
    @font-face {
        font-family: 'Eina';
        src: local('Eina Bold'), local('Eina-Bold');
        font-weight: 700;
        font-style: normal;
    }

    * { margin: 0; padding: 0; box-sizing: border-box; }
    body { background: #ffffff; font-family: 'Eina', 'Eina 01', 'Eina 02', sans-serif; overflow-x: hidden; }
    
    :root {
      --itec-blue: #1a95c1;
      --itec-dark: #434345;
      --itec-mist: #e7eef0;
      --itec-white: #ffffff;
      --itec-black: #0d0d0d;
    }
    
    .bg-itec-mist { background-color: var(--itec-mist); }
    .bg-itec-black { background-color: var(--itec-black) !important; }
    .text-itec-blue { color: var(--itec-blue); }
    .text-itec-dark { color: var(--itec-dark); }
    .text-itec-black { color: var(--itec-black); }
    
    .navbar-solid { background: white; box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 12px rgba(0,0,0,0.02); }
    .navbar-height { height: 72px; }
    
    .admin-section {
      min-height: 100vh;
      background: var(--itec-mist);
      padding-top: 90px;
      padding-bottom: 40px;
    }
    
    .tab-active { border-bottom: 2px solid var(--itec-black); color: var(--itec-black); font-weight: 600; }
    .tab-inactive { color: var(--itec-dark); font-weight: 500; }
    .tab-inactive:hover { color: var(--itec-black); }

    .sub-tab-active { background-color: var(--itec-black); color: white; }
    .sub-tab-inactive { background-color: transparent; color: var(--itec-dark); border: 1px solid #e5e7eb; }
    .sub-tab-inactive:hover { border-color: var(--itec-dark); }

    .auth-section {
      min-height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
      background: var(--itec-mist);
      padding-top: 72px;
      padding-bottom: 40px;
    }
    .auth-card { opacity: 0; transform: translateY(20px); }

    .qr-checker {
      background-image: linear-gradient(45deg, #e5e7eb 25%, transparent 25%), linear-gradient(-45deg, #e5e7eb 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #e5e7eb 75%), linear-gradient(-45deg, transparent 75%, #e5e7eb 75%);
      background-size: 16px 16px;
      background-position: 0 0, 0 8px, 8px -8px, -8px 0px;
    }
    .qr-swatch { width: 34px; height: 34px; border-radius: 8px; border: 1px solid rgba(0,0,0,0.1); cursor: pointer; padding: 0; }
    .qr-style-btn { transition: all 0.15s ease; }
    .qr-preset-swatch { width: 40px; height: 40px; border-radius: 10px; border: 2px solid transparent; cursor: pointer; transition: all 0.15s ease; overflow: hidden; }
    .qr-preset-swatch:hover { transform: scale(1.08); }
    .qr-preset-swatch.active { border-color: var(--itec-black); box-shadow: 0 0 0 2px white, 0 0 0 4px var(--itec-black); }
    
    .modal-overlay {
      background: rgba(0,0,0,0.5);
      backdrop-filter: blur(4px);
    }
    
    .file-drop-zone {
      border: 2px dashed #d1d5db;
      transition: all 0.3s ease;
    }
    .file-drop-zone:hover {
      border-color: var(--itec-blue);
      background: #f8fafc;
    }
    .file-drop-zone.dragover {
      border-color: var(--itec-blue);
      background: #eff6ff;
    }

    .icon { width: 1.25rem; height: 1.25rem; display: inline-block; vertical-align: middle; }
    .icon-sm { width: 1rem; height: 1rem; }
    .icon-lg { width: 1.5rem; height: 1.5rem; }
    
    .checkbox-custom { width: 1.1rem; height: 1.1rem; accent-color: var(--itec-black); cursor: pointer; }