/* --- FONTS --- */
        @import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@300;400;500;600;700;800&display=swap');

        /* --- VARIABLES --- */
        :root {
            --primary-color: #7c3aed; /* violet-600 */
            --primary-hover: #6d28d9; /* violet-700 */
            --primary-light: #ede9fe; /* violet-100 */
            --secondary-color: #f3f4f6;
            --secondary-hover: #e5e7eb;
            --text-color: #111827;
            --text-light: #4b5563; /* gray-600 */
            --border-color: #d1d5db;
            --white: #ffffff;
            --danger: #ef4444;
            --success: #10b981;
            --shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
            --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
            --border-radius: 0.75rem;
            --transition-speed: 0.3s;
        }

        /* --- PAGE LOADER --- */
        #page-loader {
            position: fixed; top: 0; left: 0; width: 100%; height: 100%;
            background-color: var(--white); display: flex; justify-content: center; align-items: center;
            z-index: 9999; transition: opacity 0.5s ease-out;
        }
        #page-loader.loader-hidden { opacity: 0; pointer-events: none; }
        .loader-content { display: flex; align-items: center; gap: 1rem; animation: breathe 2s ease-in-out infinite; }
        .loader-content .logo-text { font-size: 2rem; font-weight: 800; }
        .loading-dots { display: flex; gap: 0.3rem; }
        .loading-dots span {
            width: 8px; height: 8px; background-color: var(--primary-color); border-radius: 50%;
            animation: pulse 1.4s infinite;
        }
        .loading-dots span:nth-child(2) { animation-delay: 0.2s; }
        .loading-dots span:nth-child(3) { animation-delay: 0.4s; }
        @keyframes breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }
        @keyframes pulse { 0%, 100% { transform: scale(0.2); opacity: 0.5; } 50% { transform: scale(1); opacity: 1; } }

        /* --- BASE & GLOBAL STYLES --- */
        *, *::before, *::after { box-sizing: border-box; }
        html { scroll-behavior: smooth; }
        body {
            font-family: 'Be Vietnam Pro', sans-serif;
            margin: 0;
            background-color: #f9fafb;
            color: var(--text-color);
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            display: flex;
            flex-direction: column;
            min-height: 100vh;
        }
        .container-wrapper {
            max-width: 1280px;
            margin-left: auto;
            margin-right: auto;
            padding-left: 1.5rem;
            padding-right: 1.5rem;
        }
        main {
            padding-top: 74px; /* Header height */
            padding-bottom: 4rem;
            flex: 1;
            opacity: 0;
            transition: opacity 0.5s ease-in 0.3s;
        }
        body.loaded main {
            opacity: 1;
        }
        
        /* Center content vertically for landing and member views */
        main:has(#logged-out-view:not(.hidden)),
        main:has(#member-view:not(.hidden)) {
            display: flex;
            flex-direction: column;
            justify-content: center;
        }
        main:has(#logged-out-view:not(.hidden)) > #logged-out-view,
        main:has(#member-view:not(.hidden)) #member-view .container-wrapper {
            padding-top: 0;
        }

        #logged-out-view, #admin-dashboard-view .container-wrapper, #partner-dashboard-view .container-wrapper, #member-view .container-wrapper {
            padding-top: 3rem;
        }

        /* --- VIEW TRANSITIONS --- */
        @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
        .view-fade-in { animation: fadeIn 0.4s ease-out forwards; }

        /* --- HEADER --- */
        .main-header {
            position: fixed; top: 0; left: 0; width: 100%;
            background-color: rgba(255, 255, 255, 0.8);
            backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
            border-bottom: 1px solid var(--border-color); z-index: 100; padding: 1rem 0;
        }
        .main-header .container-wrapper { display: flex; justify-content: space-between; align-items: center; }
        .logo { display: flex; align-items: center; gap: 0.75rem; text-decoration: none; color: var(--text-color); }
        .logo-icon { width: 40px; height: 40px; object-fit: contain; }
        .logo-text { font-size: 1.5rem; font-weight: 800; }
        .pro-portal-badge {
            background-color: transparent;
            color: var(--text-light);
            padding: 0;
            font-size: 1.5rem;
            font-weight: 800;
            border-radius: 0;
            margin-left: 0.5rem;
            line-height: 1;
        }
        .main-nav { display: flex; align-items: center; gap: 1rem; }
        .nav-btn {
            padding: 0.5rem 1rem; border-radius: 0.5rem; font-weight: 600; cursor: pointer;
            transition: all var(--transition-speed); text-decoration: none; border: 1px solid transparent;
        }
        .nav-btn.nav-btn-secondary { background-color: transparent; color: var(--text-light); }
        .nav-btn.nav-btn-secondary:hover { color: var(--text-color); background-color: var(--secondary-color); }
        .nav-btn.nav-btn-primary { background-color: var(--primary-color); color: var(--white); border-color: var(--primary-color); }
        .nav-btn.nav-btn-primary:hover { background-color: var(--primary-hover); }

        /* --- LOGGED-OUT LANDING PAGE --- */
        .partner-landing-container {
            display: grid; grid-template-columns: 1fr; align-items: center; gap: 4rem;
            width: 100%; max-width: 1024px; margin: auto;
        }
        @media (min-width: 768px) { .partner-landing-container { grid-template-columns: 1fr 1fr; } }
        .welcome-text h1 { font-size: 2.8rem; font-weight: 800; line-height: 1.2; margin: 0 0 1.5rem; }
        .welcome-text h1 .highlight { color: var(--primary-color); }
        .welcome-text p { font-size: 1.2rem; color: var(--text-light); line-height: 1.7; }
        .auth-box {
            background-color: var(--white); padding: 2.5rem; border-radius: var(--border-radius);
            box-shadow: var(--shadow-lg); border: 1px solid var(--border-color); display: flex; flex-direction: column; gap: 1rem;
        }
        .auth-box h2 { font-size: 1.75rem; text-align: center; margin: 0 0 1rem; }
        .btn { display: inline-block; padding: 0.75rem 1.5rem; border-radius: 0.5rem; font-weight: 700; cursor: pointer; transition: all 0.2s; text-decoration: none; box-sizing: border-box; border: none; text-align: center; }
        .btn-submit { width: 100%; padding: 0.8rem; background-color: var(--primary-color); color: var(--white); border: none; border-radius: 0.5rem; font-size: 1.1rem; font-weight: 700; cursor: pointer; transition: all 0.2s; }
        .btn-submit:hover { background-color: var(--primary-hover); box-shadow: 0 4px 10px rgba(124, 58, 237, 0.3); transform: translateY(-2px); }
        .btn-submit:disabled { background-color: #a78bfa; cursor: not-allowed; }
        .btn-secondary { width: 100%; padding: 0.8rem; background-color: var(--secondary-color); color: var(--text-color); border: 1px solid var(--border-color); font-size: 1.1rem; font-weight: 700; border-radius: 0.5rem; }
        .btn-secondary:hover { background-color: var(--secondary-hover); border-color: #9ca3af; }
        .btn-danger { background-color: var(--danger); color: var(--white); }
        .btn-danger:hover { background-color: #dc2626; }
        
        /* --- LOGGED-IN MEMBER/PARTNER DASHBOARD --- */
        .dashboard-container {
            max-width: 1200px; margin: auto;
        }
        .dashboard-container h1 { font-size: 2.2rem; margin: 0 0 2rem; font-weight: 800; }
        .info-box {
            text-align: center; background-color: var(--white); padding: 3rem 4rem;
            border-radius: var(--border-radius); box-shadow: var(--shadow-lg);
        }
        .info-box p { color: var(--text-light); line-height: 1.7; font-size: 1.1rem; }
        .info-box a { color: var(--primary-color); font-weight: 600; text-decoration: none; }
        .info-box a:hover { text-decoration: underline; }

        /* Partner Search */
        .partner-search-box {
            background: var(--white); padding: 2rem; border-radius: var(--border-radius);
            box-shadow: var(--shadow); margin-bottom: 2rem;
        }
        .partner-search-form { display: flex; gap: 1rem; align-items: flex-end; }
        .partner-search-form .form-group { flex-grow: 1; margin: 0; }
        .partner-search-form .btn-submit { width: auto; }

        /* Partner History Table */
        .visit-history-table {
            width: 100%;
            border-collapse: separate;
            border-spacing: 0 1rem;
            background: transparent;
        }
        .visit-history-table th {
            padding: 1rem 1.25rem;
            text-align: left;
            background-color: transparent;
            font-weight: 600;
            font-size: 0.9rem;
            text-transform: uppercase;
            letter-spacing: 0.05em;
            border-bottom: 2px solid var(--border-color);
        }
        .visit-history-table > tbody {
            background-color: var(--white);
            border-radius: var(--border-radius);
            box-shadow: var(--shadow);
            border: 1px solid var(--border-color);
            overflow: hidden;
        }
        .visit-history-table td {
            padding: 1rem 1.25rem;
            text-align: left;
        }
        
        .pet-name-id { font-weight: 600; }
        .pet-name-id span { display: block; font-weight: 400; font-family: monospace; color: var(--text-light); font-size: 0.85rem; }
        .history-actions { display: flex; gap: 0.5rem; }
        .history-actions .btn { padding: 0.4rem 0.8rem; font-size: 0.9rem; }
        
        /* Note Sub Row styles */
        .visit-history-table tr.note-sub-row td {
            padding: 0.5rem 1.25rem 1rem 1.25rem;
            background-color: #f9fafb;
            border-top: 1px solid var(--border-color);
        }
        .note-view-mode {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 1rem;
            padding: 0.25rem 0;
        }
        .note-view-mode p {
            margin: 0;
            flex-grow: 1;
            color: var(--text-light);
            line-height: 1.6;
            white-space: pre-wrap;
        }
        .note-edit-mode .form-group {
            margin: 0;
        }
        .note-actions {
            display: flex;
            justify-content: flex-end;
            gap: 0.5rem;
            flex-shrink: 0;
        }
        .note-actions .btn {
            padding: 0.3rem 0.8rem;
            font-size: 0.85rem;
        }


        /* --- ADMIN PANEL --- */
        #admin-dashboard-view { width: 100%; }
        .admin-tabs { display: flex; flex-wrap: wrap; border-bottom: 2px solid var(--border-color); margin-bottom: 2rem; }
        .admin-tab { padding: 1rem 1.5rem; cursor: pointer; font-weight: 600; color: var(--text-light); border-bottom: 3px solid transparent; margin-bottom: -2px; transition: color .2s, border-color .2s; display: flex; align-items: center; }
        .admin-tab.active, .admin-tab:hover { color: var(--primary-color); }
        .admin-tab.active { border-bottom-color: var(--primary-color); }
        .admin-tab .badge {
            background-color: var(--danger); color: var(--white); font-size: 0.75rem; padding: 2px 6px; border-radius: 10px; margin-left: 8px; font-weight: bold;
        }
        .admin-tab-content { display: none; }
        .admin-tab-content.active { display: block; animation: fadeIn 0.5s; }
        .admin-search-form { display: flex; gap: 1rem; margin-bottom: 2rem; max-width: 600px; }
        .admin-list-item { background: var(--white); border: 1px solid var(--border-color); padding: 1.5rem; border-radius: var(--border-radius); margin-bottom: 1rem; box-shadow: var(--shadow); transition: opacity 0.3s; }
        .admin-list-item h3 { margin-top: 0; font-size: 1.1rem; display: flex; align-items: center; gap: 0.5rem; }
        .user-list-item, .pet-list-item { display: flex; justify-content: space-between; align-items: center; }
        .partner-badge { background-color: var(--primary-light); color: var(--primary-color); padding: 0.2rem 0.5rem; font-size: 0.8rem; border-radius: 0.25rem; font-weight: 600; }
        
        /* New User Management Tabs */
        .admin-sub-tabs {
            display: flex;
            gap: 0.5rem;
            margin-bottom: 1.5rem;
            border-bottom: 1px solid var(--border-color);
        }
        .admin-sub-tab {
            padding: 0.75rem 1.25rem;
            cursor: pointer;
            font-weight: 600;
            color: var(--text-light);
            border: none;
            background: none;
            border-bottom: 2px solid transparent;
            margin-bottom: -1px;
            transition: color .2s, border-color .2s;
        }
        .admin-sub-tab.active, .admin-sub-tab:hover {
            color: var(--primary-color);
        }
        .admin-sub-tab.active {
            border-bottom-color: var(--primary-color);
        }
        .user-tab-content { display: none; }
        .user-tab-content.active { display: block; animation: fadeIn 0.4s; }


        /* --- MODALS & FORMS --- */
        .modal-overlay {
            position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(17, 24, 39, 0.6);
            display: flex; justify-content: center; align-items: flex-start; opacity: 0; pointer-events: none;
            visibility: hidden; transition: opacity var(--transition-speed) ease, visibility 0s linear var(--transition-speed);
            z-index: 1050; overflow-y: auto; padding: 2rem 1rem;
        }
        .modal-overlay.show { opacity: 1; pointer-events: auto; visibility: visible; transition: opacity var(--transition-speed) ease; }
        .modal-content {
            background: var(--white); padding: 2.5rem; border-radius: var(--border-radius); width: 100%;
            max-width: 500px; opacity: 0; transform: scale(0.95) translateY(10px);
            transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.3s ease;
        }
        .modal-overlay.show .modal-content { opacity: 1; transform: scale(1) translateY(0); }
        #pet-search-result-modal .modal-content { max-width: 95vw; width: 95%; margin: 2vh auto; max-height: 96vh; display: flex; flex-direction: column; }
        #pet-search-result-modal .modal-content > div:not(.modal-header):not(.modal-actions) { flex: 1; overflow-y: auto; padding-right: 1rem; }
        .modal-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.5rem; flex-shrink: 0; }
        .modal-header h2 { margin: 0; font-size: 1.5rem; }
        .close-modal {
            font-size: 2rem; font-weight: 300; color: var(--text-light); cursor: pointer; border: none; background: transparent;
            width: 40px; height: 40px; border-radius: 50%; display: flex; justify-content: center; align-items: center;
            line-height: 1; padding-bottom: 4px; transition: background-color 0.2s, color 0.2s;
        }
        .close-modal:hover { background-color: var(--secondary-hover); color: var(--text-color); }
        .form-group { margin-bottom: 1.25rem; }
        .form-group label { display: block; margin-bottom: 0.5rem; font-weight: 500; }
        .form-group input, .form-group select, .form-group textarea {
            width: 100%; padding: 0.75rem 1rem; border: 1px solid var(--border-color); border-radius: 0.5rem; box-sizing: border-box;
            font-size: 1rem; font-family: 'Be Vietnam Pro', sans-serif; transition: border-color 0.2s, box-shadow 0.2s;
            background-color: var(--white); color: var(--text-color);
        }
        .form-group input:read-only, .form-group textarea:read-only { background-color: var(--secondary-color); cursor: not-allowed; color: var(--text-light); }
        .form-group input:focus, .form-group select:focus, .form-group textarea:focus { outline: none; border-color: var(--primary-color); box-shadow: 0 0 0 3px var(--primary-light); }
        .modal-form-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
        @media (min-width: 640px) { #record-modal .modal-content { max-width: 800px; } .modal-form-grid { grid-template-columns: repeat(2, 1fr); } }
        .password-strength { list-style: none; padding: 0; margin-top: 0.5rem; font-size: 0.85rem; }
        .password-strength li { color: var(--danger); transition: color 0.3s; }
        .password-strength li.valid { color: var(--success); text-decoration: line-through; }
        #captcha-group { display: flex; align-items: center; gap: 1rem; }
        #captcha-question { font-weight: 700; padding: 0.75rem; background: var(--secondary-color); border-radius: 0.5rem; }
        hr.modal-divider { border: none; border-top: 1px solid var(--border-color); margin: 2rem 0; }
        .btn-submit.loading { color: transparent !important; pointer-events: none; position: relative; }
        .btn-submit.loading::after {
            content: ''; position: absolute; left: 50%; top: 50%; width: 24px; height: 24px;
            margin-left: -12px; margin-top: -12px; border: 3px solid rgba(255, 255, 255, 0.3);
            border-top-color: var(--white); border-radius: 50%; animation: spin 0.8s linear infinite;
        }
        @keyframes spin { to { transform: rotate(360deg); } }
        .social-login-divider { position: relative; text-align: center; margin: 1rem 0; color: var(--text-light); font-weight: 600; }
        .social-login-divider::before, .social-login-divider::after { content:""; position: relative; top:-0.35rem; display:inline-block; width:35%; height:1px; background:var(--border-color); margin:0 0.75rem; }
        .social-btn { width:100%; display:inline-flex; align-items:center; justify-content:center; gap:0.5rem; padding:0.75rem 1rem; border:1px solid var(--border-color); border-radius:0.5rem; background:var(--white); color:var(--text-color); font-weight:700; cursor:pointer; transition:background-color .2s; }
        .social-btn:hover { background-color: var(--secondary-color); }
        .social-btn svg { flex:0 0 20px; }
        .social-btn[disabled] { opacity: .7; pointer-events: none; }
        .social-btn .spinner { width: 16px; height: 16px; border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%; display: inline-block; animation: spin .9s linear infinite; }
        #pet-search-result-modal .modal-content { max-width: 600px; }
        .modal-actions { display: flex; justify-content: flex-end; gap: 1rem; margin-top: 2rem; }
        .modal-actions .btn { width: auto; }
        

        /* --- PET PROFILE VIEW --- */
        #pet-profile-view { padding: 2rem 0 4rem; }
        #pet-profile-view .pet-profile-header {
            position: -webkit-sticky;
            position: sticky;
            top: 74px; /* Main header height */
            background-color: rgba(255, 255, 255, 0.95);
            -webkit-backdrop-filter: blur(8px);
            backdrop-filter: blur(8px);
            z-index: 50;
        }
        .pet-profile-header { display: flex; align-items: center; gap: 1rem; margin-bottom: 2rem; padding-bottom: 1rem; border-bottom: 1px solid var(--border-color); }
        .pet-profile-header h1 { margin: 0; font-size: 2rem; font-weight: 800; flex-grow: 1; }
        #pet-profile-back-btn { background: none; border: none; cursor: pointer; padding: 0.5rem; border-radius: 50%; color: var(--text-color); display: flex; align-items: center; justify-content: center; }
        #pet-profile-back-btn:hover { background-color: var(--secondary-color); }
        .pet-profile-layout { display: grid; grid-template-columns: 1fr; gap: 2rem; }
        @media (min-width: 992px) { .pet-profile-layout { grid-template-columns: 400px 1fr; } }
        .pet-profile-images { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
        .pet-profile-image-box { position: relative; border-radius: var(--border-radius); overflow: hidden; background-color: var(--secondary-color); border: 1px solid var(--border-color); }
        .pet-profile-image-box img { width: 100%; height: 100%; object-fit: cover; }
        .pet-profile-image-box .placeholder-icon { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 30%; height: 30%; color: var(--border-color); }
        .upload-overlay {
            position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(17, 24, 39, 0);
            color: rgba(255, 255, 255, 0); display: flex; flex-direction: column; justify-content: center;
            align-items: center; cursor: pointer; transition: all 0.3s; opacity: 0;
        }
        .pet-profile-image-box:hover .upload-overlay { background-color: rgba(17, 24, 39, 0.6); color: rgba(255, 255, 255, 1); opacity: 1; }
        .upload-overlay.loading { background-color: rgba(17, 24, 39, 0.8); opacity: 1; pointer-events: none; }
        .upload-overlay.loading::after { content: ''; width: 40px; height: 40px; border: 4px solid rgba(255, 255, 255, 0.3); border-top-color: var(--white); border-radius: 50%; animation: spin 1s linear infinite; }
        .upload-overlay .upload-icon { width: 48px; height: 48px; margin-bottom: 0.5rem; }
        .upload-overlay.loading .upload-icon, .upload-overlay.loading span { display: none; }
        .pet-profile-details { background-color: var(--white); padding: 2rem; border: 1px solid var(--border-color); border-radius: var(--border-radius); align-self: flex-start; }
        .pet-profile-details-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
        @media (min-width: 640px) { .pet-profile-details-grid { grid-template-columns: repeat(2, 1fr); } }
        .detail-item strong { display: block; color: var(--text-light); font-weight: 500; margin-bottom: 0.25rem; }
        .detail-item span { font-size: 1.1rem; font-weight: 600; }
        .pet-profile-admin-actions { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--border-color); display: flex; gap: 1rem; }

        /* --- HEALTH RECORDS SECTION --- */
        .health-records-section { margin-top: 2rem; background-color: var(--white); padding: 2rem; border: 1px solid var(--border-color); border-radius: var(--border-radius); }
        .health-records-section h2 { margin-top: 0; margin-bottom: 1.5rem; font-size: 1.5rem; }
        .health-records-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.5rem; border-bottom: 1px solid var(--border-color); padding-bottom: 1rem; }
        .health-records-tabs { display: flex; gap: 0.5rem; }
        .health-records-tab { padding: 0.6rem 1.2rem; font-weight: 600; border-radius: 0.5rem; border: 1px solid transparent; background-color: transparent; color: var(--text-light); cursor: pointer; }
        .health-records-tab.active { background-color: var(--primary-light); color: var(--primary-color); }
        #add-record-btn { width: auto; }
        .health-records-table-wrapper { width: 100%; overflow-x: auto; }
        .health-records-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
        .health-records-table th, .health-records-table td { border: 1px solid var(--border-color); padding: 0.75rem; text-align: left; }
        .health-records-table th { background-color: var(--secondary-color); }
        .record-actions { display: flex; gap: 0.5rem; }
        .record-actions .btn { padding: 0.3rem 0.6rem; font-size: 0.8rem; }
        .no-records-message { text-align: center; color: var(--text-light); padding: 2rem; background-color: var(--secondary-color); border-radius: var(--border-radius); }

        /* --- IMAGE CROP MODAL --- */
        #crop-container { flex-grow: 1; display: flex; justify-content: center; align-items: center; background-color: var(--secondary-color); border-radius: var(--border-radius); }
        #image-to-crop { display: block; max-width: 100%; }
        .cropper-view-box { box-shadow: 0 0 0 1px #3875ff; outline: 5000px solid rgba(0, 0, 0, 0.5); }
        .cropper-face { background-color: transparent !important; }

        /* --- FOOTER --- */
        .main-footer { background-color: var(--text-color); color: #d1d5db; padding: 2rem 0; }
        .footer-bottom { text-align: center; font-size: 0.9rem; }

        /* --- UTILITIES --- */
        .hidden { display: none !important; }
        body.modal-open { overflow: hidden; }
        .toast-notification {
            position: fixed; bottom: 20px; right: 20px; background-color: var(--text-color); color: var(--white);
            padding: 1rem 1.5rem; border-radius: 0.5rem; box-shadow: var(--shadow-lg); font-weight: 500;
            transform: translateY(150%); transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
            z-index: 1060; max-width: 400px; word-break: break-word;
        }
        .toast-notification.show { transform: translateY(0); }
        .toast-notification.error { background-color: var(--danger); }

/* --- PARTNER APP LAYOUT --- */
.partner-app-layout {
    display: flex;
    height: 100vh;
    width: 100vw;
    background-color: #ffffff;
    overflow: hidden;
}

/* SIDEBAR */
.partner-sidebar {
    width: 260px;
    background-color: #f8f9fa;
    border-right: 1px solid var(--border-color);
    display: flex;
    flex-direction: column;
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 100;
    box-shadow: 2px 0 8px rgba(0,0,0,0.02);
}

.partner-sidebar.collapsed {
    width: 68px;
}

.sidebar-header {
    height: 60px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px;
    border-bottom: 1px solid var(--border-color);
    box-sizing: border-box;
}

.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 8px;
    overflow: hidden;
    white-space: nowrap;
}

.sidebar-logo {
    width: 28px;
    height: 28px;
    object-fit: contain;
    flex-shrink: 0;
}

.sidebar-title {
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--primary-color);
    opacity: 1;
    transition: opacity 0.2s, width 0.2s;
}

.partner-sidebar.collapsed .sidebar-title {
    opacity: 0;
    width: 0;
    pointer-events: none;
}

.sidebar-toggle-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-color);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    border-radius: 8px;
    transition: background-color 0.2s;
    flex-shrink: 0;
}
.sidebar-toggle-btn:hover { background-color: var(--border-color); }

.partner-sidebar.collapsed .sidebar-header {
    justify-content: center;
    padding: 0;
}
.partner-sidebar.collapsed .sidebar-brand {
    display: none;
}
.partner-sidebar.collapsed .sidebar-toggle-btn {
    display: flex;
}
.partner-sidebar.collapsed .sidebar-logo {
    margin-right: 0;
}

/* SIDEBAR MENU */
.sidebar-menu {
    list-style: none;
    padding: 12px 0;
    margin: 0;
    overflow-y: auto;
    flex-grow: 1;
    min-height: 0;
    counter-reset: menu-counter;
}

.sidebar-menu::-webkit-scrollbar { width: 4px; }
.sidebar-menu::-webkit-scrollbar-thumb { background-color: var(--border-color); border-radius: 4px; }

.menu-item {
    margin: 4px 12px;
    border-radius: 8px;
    counter-increment: menu-counter;
}

.menu-title {
    padding: 12px;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--text-color);
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: 8px;
    transition: background-color 0.2s, color 0.2s;
    white-space: nowrap;
    box-sizing: border-box;
}

.menu-text::before {
    content: counter(menu-counter) ". ";
}

.menu-icon {
    flex-shrink: 0;
    color: var(--text-light);
    transition: color 0.2s;
}

.menu-title:hover {
    background-color: #eef2f6;
    color: var(--primary-color);
}
.menu-title:hover .menu-icon {
    color: var(--primary-color);
}

.partner-sidebar.collapsed .menu-title {
    justify-content: center;
    padding: 12px 0;
}
.partner-sidebar.collapsed .menu-text { 
    display: none; 
}
.partner-sidebar.collapsed .menu-item {
    margin: 4px 8px;
}

/* Accordion logic */
.submenu {
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
}

.menu-item.active .submenu {
    max-height: 1500px;
    transition: max-height 0.4s ease-in;
}
.menu-item.active .menu-title {
    background-color: var(--primary-light);
    color: var(--primary-color);
}
.menu-item.active .menu-icon {
    color: var(--primary-color);
}

.submenu li {
    padding: 10px 16px 10px 44px;
    font-size: 0.85rem;
    color: var(--text-light);
    cursor: pointer;
    transition: color 0.2s, background-color 0.2s;
    border-radius: 6px;
    margin: 2px 0;
}
.submenu li:hover {
    background-color: var(--white);
    color: var(--primary-color);
}

/* MAIN CONTENT */
.partner-main-content {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* TOPBAR */
.partner-topbar {
    height: 60px;
    flex-shrink: 0;
    background-color: #ffffff;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.02);
}

.topbar-left .partner-org-name {
    font-size: 1.15rem;
    font-weight: 700;
    margin: 0;
    color: var(--text-color);
}

.topbar-right {
    display: flex;
    align-items: center;
    gap: 16px;
}

/* TOPBAR SEARCH FORM */
.topbar-search-form {
    display: flex;
    align-items: center;
    background-color: var(--background-color);
    border: 1px solid var(--border-color);
    border-radius: 20px;
    padding: 2px 12px;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.topbar-search-form:focus-within {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 2px var(--primary-light);
}
.topbar-search-form input {
    border: none;
    background: transparent;
    padding: 6px 8px;
    font-size: 0.9rem;
    outline: none;
    width: 180px;
    color: var(--text-color);
}
.topbar-search-form .search-submit-btn {
    padding: 4px;
    color: var(--text-light);
}
.topbar-search-form .search-submit-btn:hover {
    color: var(--primary-color);
    background: none;
}

.icon-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-light);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    border-radius: 50%;
    transition: background-color 0.2s, color 0.2s;
}
.icon-btn:hover {
    background-color: #f1f5f9;
    color: var(--primary-color);
}
.logout-btn:hover {
    color: var(--danger);
    background-color: #fee2e2;
}

/* WORKSPACE */
.partner-workspace {
    flex-grow: 1;
    padding: 24px;
    overflow-y: auto;
}

/* Hide global header/footer when in partner dashboard */
body.is-partner-view .main-header,
body.is-partner-view .main-footer {
    display: none !important;
}

/* We need to override main display if it's hidden */
body.is-partner-view #partner-dashboard-view {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 1000;
    background: #fff;
    display: block !important;
}

/* --- ADMIN PANEL --- */
#admin-dashboard-view { width: 100%; margin-top: 3rem; }
.admin-tabs { display: flex; flex-wrap: wrap; border-bottom: 2px solid var(--border-color); margin-bottom: 2rem; }
.admin-tab { padding: 1rem 1.5rem; cursor: pointer; font-weight: 600; color: var(--text-light); border-bottom: 3px solid transparent; margin-bottom: -2px; transition: color .2s, border-color .2s; display: flex; align-items: center; }
.admin-tab.active, .admin-tab:hover { color: var(--primary-color); }
.admin-tab.active { border-bottom-color: var(--primary-color); }
.admin-tab .badge { background-color: var(--danger); color: var(--white); font-size: 0.75rem; padding: 2px 6px; border-radius: 10px; margin-left: 8px; font-weight: bold; }
.admin-tab-content { display: none; }
.admin-tab-content.active { display: block; animation: fadeIn 0.5s; }
.admin-search-form { display: flex; gap: 1rem; margin-bottom: 2rem; max-width: 600px; }
.admin-list-item { background: var(--white); border: 1px solid var(--border-color); padding: 1.5rem; border-radius: var(--border-radius); margin-bottom: 1rem; box-shadow: var(--shadow); transition: opacity 0.3s; }
.admin-list-item h3 { margin-top: 0; font-size: 1.1rem; display: flex; align-items: center; gap: 0.5rem; }
.user-list-item, .pet-list-item { display: flex; justify-content: space-between; align-items: center; }
.partner-badge { background-color: var(--primary-light); color: var(--primary-color); padding: 0.2rem 0.5rem; font-size: 0.8rem; border-radius: 0.25rem; font-weight: 600; }
.admin-sub-tabs { display: flex; gap: 0.5rem; margin-bottom: 1.5rem; border-bottom: 1px solid var(--border-color); }
.admin-sub-tab { padding: 0.75rem 1.25rem; cursor: pointer; font-weight: 600; color: var(--text-light); border: none; background: none; border-bottom: 2px solid transparent; margin-bottom: -1px; transition: color .2s, border-color .2s; }
.admin-sub-tab.active, .admin-sub-tab:hover { color: var(--primary-color); }
.admin-sub-tab.active { border-bottom-color: var(--primary-color); }
.user-tab-content { display: none; }
.user-tab-content.active { display: block; animation: fadeIn 0.4s; }

/* Workspace Switcher */
.workspace-switcher {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text-main);
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    outline: none;
    transition: all 0.2s ease;
}

.workspace-switcher:hover {
    border-color: var(--primary-color);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

/* --- PREMIUM TABLE --- */
.table-container {
    width: 100%;
    overflow-x: auto;
    background: var(--white);
    border-radius: var(--border-radius);
    box-shadow: var(--shadow);
    border: 1px solid var(--border-color);
    margin-bottom: 2rem;
}
.table {
    width: 100%;
    border-collapse: collapse;
    min-width: 700px;
}
.table th, .table td {
    padding: 1rem 1.5rem;
    text-align: left;
    border-bottom: 1px solid var(--border-color);
}
.table th {
    background-color: var(--secondary-color);
    font-weight: 600;
    color: var(--text-color);
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 0.05em;
}
.table tbody tr:hover {
    background-color: #f9fafb;
}
.table td {
    vertical-align: middle;
}

/* --- PREMIUM CHECKBOXES --- */
input[type='checkbox'].perm-pet-field,
input[type='checkbox'].partner-role-menu-main,
input[type='checkbox'].partner-role-menu-sub,
input[type='checkbox'].partner-role-pet-field {
    appearance: none;
    -webkit-appearance: none;
    background-color: #e5e7eb;
    margin: 0;
    font: inherit;
    color: currentColor;
    width: 1.35em;
    height: 1.35em;
    border: 2px solid #d1d5db;
    border-radius: 0.3em;
    display: grid;
    place-content: center;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

input[type='checkbox'].perm-pet-field::before,
input[type='checkbox'].partner-role-menu-main::before,
input[type='checkbox'].partner-role-menu-sub::before,
input[type='checkbox'].partner-role-pet-field::before {
    content: '';
    width: 0.7em;
    height: 0.7em;
    transform: scale(0);
    transition: 120ms transform ease-in-out;
    background-color: white;
    transform-origin: bottom left;
    clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}

input[type='checkbox'].perm-pet-field:checked,
input[type='checkbox'].partner-role-menu-main:checked,
input[type='checkbox'].partner-role-menu-sub:checked,
input[type='checkbox'].partner-role-pet-field:checked {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

input[type='checkbox'].perm-pet-field:checked::before,
input[type='checkbox'].partner-role-menu-main:checked::before,
input[type='checkbox'].partner-role-menu-sub:checked::before,
input[type='checkbox'].partner-role-pet-field:checked::before {
    transform: scale(1);
}

input[type='checkbox'].partner-role-menu-main:indeterminate,
input[type='checkbox'].partner-role-pet-field:indeterminate {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}
input[type='checkbox'].partner-role-menu-main:indeterminate::before,
input[type='checkbox'].partner-role-pet-field:indeterminate::before {
    content: '';
    width: 0.7em;
    height: 0.2em;
    background-color: white;
    clip-path: none;
    transform: scale(1);
    border-radius: 2px;
}

label.perm-node, .perm-node-label {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    cursor: pointer;
    padding: 0.6rem 0.8rem;
    border-radius: 8px;
    transition: background-color 0.2s, transform 0.1s;
    user-select: none;
}
label.perm-node:hover, .perm-node-label:hover {
    background-color: var(--secondary-color);
}
label.perm-node:active, .perm-node-label:active {
    transform: scale(0.98);
}

/* --- PREMIUM PERMISSION TABS --- */
.admin-permissions-tabs {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid var(--border-color);
}
.admin-perm-tab {
    padding: 0.75rem 1.25rem;
    cursor: pointer;
    font-weight: 600;
    color: var(--text-light);
    border: none;
    background: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    transition: color .2s, border-color .2s;
    font-size: 0.95rem;
}
.admin-perm-tab.active, .admin-perm-tab:hover {
    color: var(--primary-color);
}
.admin-perm-tab.active {
    border-bottom-color: var(--primary-color);
}
.admin-perm-content {
    display: none;
}
.admin-perm-content.active {
    display: block;
    animation: fadeIn 0.4s;
}

/* --- PREMIUM TOGGLE SWITCH --- */
.toggle-switch-wrapper {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    cursor: pointer;
    user-select: none;
}

.toggle-switch {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 26px;
    flex-shrink: 0;
}

.toggle-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #cbd5e1;
    transition: .3s cubic-bezier(0.4, 0.0, 0.2, 1);
    border-radius: 34px;
}

.toggle-slider:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: .3s cubic-bezier(0.4, 0.0, 0.2, 1);
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.toggle-switch input:checked + .toggle-slider {
    background-color: var(--primary-color);
}

.toggle-switch input:focus + .toggle-slider {
    box-shadow: 0 0 1px var(--primary-color);
}

.toggle-switch input:checked + .toggle-slider:before {
    transform: translateX(24px);
}

.toggle-label-text {
    font-weight: 500;
    color: var(--text-color);
}

/* --- PARTNER RECEPTION MODULE --- */
.partner-page-heading { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.5rem; }
.partner-page-heading h2 { margin:0; }
.partner-page-heading p { margin:.35rem 0 0; color:var(--text-light); }
.partner-page-heading .btn { width:auto; white-space:nowrap; }
.partner-filter-bar { display:flex; align-items:center; gap:.75rem; padding:1rem; margin-bottom:1rem; background:var(--white); border:1px solid var(--border-color); border-radius:var(--border-radius); box-shadow:var(--shadow); }
.partner-filter-bar input, .partner-filter-bar select { min-width:0; padding:.7rem .85rem; border:1px solid var(--border-color); border-radius:7px; background:var(--white); }
.partner-filter-bar input[type="search"] { flex:1; }
.partner-filter-bar .btn { width:auto; }
.reception-filters { flex-wrap:wrap; }
.reception-filters input[type="search"] { min-width:260px; }
.reception-quick-actions { display:grid; gap:.65rem; margin-top:1rem; }
.reception-quick-actions .btn { width:100%; padding:.8rem; }
.partner-avatar { width:42px; height:42px; object-fit:cover; border-radius:50%; background:#eef2f7; border:1px solid var(--border-color); }
.partner-avatar-fallback { display:flex; align-items:center; justify-content:center; overflow:hidden; font-size:1.25rem; }
.partner-avatar-fallback img { width:100%; height:100%; object-fit:cover; }
.partner-status { display:inline-flex; align-items:center; padding:.25rem .6rem; border-radius:999px; font-size:.78rem; font-weight:700; background:#eef2ff; color:#4338ca; }
.partner-status.examination { background:#fff7ed; color:#c2410c; }
.partner-status.paraclinical { background:#ecfeff; color:#0e7490; }
.partner-status.completed, .partner-status.cashier { background:#ecfdf5; color:#047857; }
.partner-dialog { position:fixed; inset:0; z-index:1300; display:flex; align-items:center; justify-content:center; padding:1.5rem; background:rgba(15,23,42,.55); backdrop-filter:blur(2px); }
.partner-dialog.hidden { display:none !important; }
.partner-dialog-card { width:min(720px, 96vw); max-height:92vh; overflow:auto; padding:1.5rem; background:var(--white); border-radius:14px; box-shadow:0 24px 60px rgba(15,23,42,.3); }
.partner-dialog-wide { width:min(980px, 96vw); }
.partner-dialog-header { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-bottom:1rem; margin-bottom:1.25rem; border-bottom:1px solid var(--border-color); }
.partner-dialog-header h3 { margin:0; }
.partner-dialog-close { border:0; background:transparent; font-size:1.8rem; line-height:1; cursor:pointer; color:var(--text-light); }
.partner-dialog-actions { display:flex; justify-content:flex-end; gap:.75rem; padding-top:1.25rem; margin-top:1rem; border-top:1px solid var(--border-color); }
.partner-dialog-actions .btn { width:auto; }
.system-config-tabs { display:flex; flex-wrap:wrap; gap:.35rem; margin:0 0 1.25rem; border-bottom:1px solid var(--border-color); }
.system-config-tabs button { padding:.7rem 1rem; border:0; border-bottom:3px solid transparent; background:transparent; color:var(--text-light); font:inherit; font-weight:700; cursor:pointer; }
.system-config-tabs button.active { border-bottom-color:var(--primary-color); color:var(--primary-color); }
.system-config-form { display:flex; flex-direction:column; gap:1rem; max-width:1100px; }
.system-config-card { padding:1.25rem; border:1px solid var(--border-color); border-radius:12px; background:var(--white); box-shadow:var(--shadow); }
.system-config-card h3 { margin:0 0 .45rem; color:var(--primary-color); }
.system-config-card p { margin:0 0 1rem; color:var(--text-light); font-size:.86rem; }
.system-config-card textarea { width:100%; box-sizing:border-box; padding:.75rem; border:1px solid var(--border-color); border-radius:8px; color:var(--text-color); font:inherit; line-height:1.5; resize:vertical; }
.system-config-card code { padding:.12rem .3rem; border-radius:4px; background:#eef2ff; color:#3730a3; }
.system-catalog-workspace { display:flex; flex-direction:column; gap:1rem; max-width:1180px; }
.system-catalog-card { padding:1.15rem; border:1px solid var(--border-color); border-radius:14px; background:var(--white); box-shadow:var(--shadow); }
.system-catalog-card__header { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.system-catalog-card__header h3,.system-catalog-card h3 { margin:0; color:var(--primary-color); }
.system-catalog-card__header p { margin:.25rem 0 0; color:var(--text-light); font-size:.85rem; }
.system-catalog-card__header .btn { width:auto; flex:0 0 auto; }
.system-catalog-card .modal-form-grid > label,#partner-system-catalog-form > label { display:flex; flex-direction:column; gap:.4rem; color:var(--text-color); font-weight:600; }
.system-catalog-card input,.system-catalog-card select,#partner-system-catalog-form input,#partner-system-catalog-form select,#partner-system-catalog-form textarea { width:100%; box-sizing:border-box; padding:.72rem .8rem; border:1px solid var(--border-color); border-radius:8px; background:var(--white); color:var(--text-color); font:inherit; font-weight:400; }
.system-catalog-table th { white-space:nowrap; }
.system-catalog-actions { display:flex; gap:.4rem; white-space:nowrap; }
.system-catalog-actions .btn { width:auto; padding:.38rem .65rem; font-size:.8rem; }
.system-catalog-check { display:flex!important; align-items:center; gap:.6rem; padding-top:1.7rem; }
.system-catalog-check input { width:auto!important; }
#partner-system-catalog-editor .partner-dialog-card { max-width:760px; }
#partner-system-catalog-editor textarea { width:100%; box-sizing:border-box; }
@media (max-width:760px) { .system-catalog-card__header { align-items:flex-start; flex-direction:column; } .system-catalog-actions { flex-direction:column; } }
.paraclinical-filter-bar { display:flex; flex-wrap:wrap; gap:1rem; align-items:end; padding:1rem; margin-bottom:1rem; border:1px solid var(--border-color); border-radius:10px; background:var(--white); }
.paraclinical-filter-bar label { display:flex; flex-direction:column; gap:.35rem; min-width:220px; color:var(--text-light); font-size:.8rem; font-weight:700; }
.paraclinical-filter-bar input, .paraclinical-filter-bar select, .paraclinical-detail-form select, .paraclinical-detail-form textarea { padding:.65rem .75rem; border:1px solid var(--border-color); border-radius:7px; color:var(--text-color); font:inherit; background:var(--white); }
.paraclinical-workspace { display:grid; grid-template-columns:minmax(280px,.8fr) minmax(0,2.2fr); gap:1rem; align-items:start; }
.paraclinical-queue-card, .paraclinical-detail-panel { min-height:520px; border:1px solid var(--border-color); border-radius:12px; background:var(--white); box-shadow:var(--shadow); }
.paraclinical-queue-card__header { display:flex; justify-content:space-between; padding:1rem; border-bottom:1px solid var(--border-color); background:#f8fafc; }
.paraclinical-queue-card__header span { min-width:24px; padding:.15rem .45rem; border-radius:999px; background:var(--primary-light); color:var(--primary-color); text-align:center; }
.paraclinical-queue-list { display:flex; flex-direction:column; gap:.55rem; max-height:650px; overflow:auto; padding:1rem; }
.paraclinical-queue-item { display:flex; flex-direction:column; gap:.35rem; width:100%; padding:.85rem; border:1px solid var(--border-color); border-radius:9px; background:var(--white); color:var(--text-color); text-align:left; cursor:pointer; }
.paraclinical-queue-item:hover { border-color:var(--primary-color); box-shadow:var(--shadow); }
.paraclinical-queue-item span { display:flex; justify-content:space-between; gap:.5rem; color:var(--primary-color); }
.paraclinical-queue-item b { color:var(--text-color); }
.paraclinical-queue-item small { color:var(--text-light); }
.paraclinical-queue-item em { align-self:flex-start; font-style:normal; font-size:.72rem; }
.paraclinical-detail-panel { padding:1.5rem; }
.paraclinical-detail-header { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; padding-bottom:1rem; border-bottom:1px solid var(--border-color); }
.paraclinical-detail-header h3 { margin:.15rem 0; color:var(--primary-color); }
.paraclinical-detail-header label { display:flex; flex-direction:column; gap:.35rem; min-width:150px; color:var(--text-light); font-size:.8rem; font-weight:700; }
.paraclinical-detail-meta { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; margin:1rem 0; padding:1rem; border-radius:9px; background:#f8fafc; }
.paraclinical-detail-meta span, .paraclinical-detail-meta strong { display:block; }
.paraclinical-detail-meta span { margin-bottom:.25rem; color:var(--text-light); font-size:.75rem; }
.paraclinical-detail-meta strong { font-size:.86rem; }
.paraclinical-detail-form section { padding:1rem 0; border-bottom:1px solid var(--border-color); }
.paraclinical-service-list { display:flex; flex-direction:column; gap:.65rem; }
.paraclinical-service-row { display:grid; grid-template-columns:1fr minmax(260px,1.4fr); gap:1rem; align-items:center; padding:.8rem; border:1px solid var(--border-color); border-radius:8px; }
.paraclinical-service-row strong, .paraclinical-service-row small { display:block; }
.paraclinical-service-row small { margin-top:.25rem; color:var(--text-light); }
@media (max-width:900px) { .paraclinical-workspace, .paraclinical-detail-meta { grid-template-columns:1fr; } .paraclinical-service-row { grid-template-columns:1fr; } .paraclinical-detail-header { flex-direction:column; } }
.grooming-board { display:grid; grid-template-columns:repeat(5,minmax(210px,1fr)); gap:1rem; align-items:start; overflow-x:auto; }
.grooming-column { min-height:440px; padding:.75rem; border:1px solid var(--border-color); border-radius:11px; background:#f8fafc; }
.grooming-column > header { display:flex; justify-content:space-between; gap:.5rem; padding:.35rem .35rem .75rem; color:var(--primary-color); }
.grooming-column > header span { min-width:23px; border-radius:999px; background:var(--primary-light); text-align:center; }
.grooming-column > div { display:flex; flex-direction:column; gap:.65rem; }
.grooming-job-card { padding:.85rem; border:1px solid var(--border-color); border-radius:9px; background:var(--white); box-shadow:var(--shadow); }
.grooming-job-card h4 { margin:.2rem 0; color:var(--text-color); }
.grooming-job-card p { margin:.25rem 0; color:var(--text-light); font-size:.82rem; }
.grooming-job-card small { display:block; min-height:32px; margin:.5rem 0; color:var(--text-light); }
.grooming-job-card > div { display:flex; gap:.4rem; justify-content:flex-end; }
.grooming-job-card .btn { width:auto; padding:.4rem .6rem; font-size:.76rem; }
.hotel-status-tabs{display:flex;gap:.5rem;margin:1rem 0}.hotel-status-tabs button{border:1px solid var(--border-color);background:var(--white);padding:.65rem 1rem;border-radius:8px;cursor:pointer}.hotel-status-tabs button.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.hotel-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:1rem}.hotel-room-grid{display:grid;gap:.75rem}.hotel-room-card{border:1px solid var(--border-color);border-radius:10px;padding:.85rem;background:var(--white);display:flex;flex-direction:column;gap:.25rem}.hotel-room-card span{font-size:.85rem;color:var(--text-light)}
.pharmacy-tabs,.cashier-tabs{display:flex;gap:.5rem;margin:1rem 0}.pharmacy-tabs button,.cashier-tabs button{border:1px solid var(--border-color);background:var(--white);padding:.65rem 1rem;border-radius:8px;cursor:pointer}.pharmacy-tabs button.active,.cashier-tabs button.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.payment-summary{background:var(--primary-light);border-radius:8px;padding:1rem;margin-bottom:1rem;line-height:1.8}
@media (max-width:1200px) { .grooming-board { grid-template-columns:repeat(5,240px); } }
.reception-detail-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem 2rem; }
.reception-detail-grid dt { color:var(--text-light); font-size:.82rem; }
.reception-detail-grid dd { margin:.25rem 0 0; font-weight:600; }
.empty-state { padding:2rem 1rem; text-align:center; color:var(--text-light); }
.empty-state.error { color:var(--danger); }
.exam-queue-card { display:flex; flex-direction:column; gap:.45rem; width:100%; padding:1rem; border:1px solid var(--border-color); border-radius:10px; background:#fff; color:var(--text-color); text-align:left; cursor:pointer; transition:border-color .2s,box-shadow .2s,transform .2s; }
.exam-queue-card:hover { border-color:var(--primary-color); box-shadow:var(--shadow); transform:translateY(-1px); }
.exam-queue-card__top { display:flex; justify-content:space-between; gap:.75rem; color:var(--primary-color); }
.exam-queue-card__top span { color:var(--text-light); font-size:.78rem; }
.exam-queue-card small { display:block; color:var(--text-light); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.exam-queue-card em { align-self:flex-start; padding:.18rem .5rem; border-radius:999px; background:var(--primary-light); color:var(--primary-color); font-size:.72rem; font-style:normal; font-weight:700; }
.exam-queue-layout { display:grid; grid-template-columns:minmax(260px, .85fr) minmax(0, 2.15fr); gap:1.25rem; align-items:start; }
.exam-queue-sidebar { display:flex; flex-direction:column; min-height:500px; border:1px solid var(--border-color); border-radius:var(--border-radius); background:var(--white); box-shadow:var(--shadow); }
.exam-queue-list { display:flex; flex-direction:column; flex:1; gap:.5rem; max-height:calc(100vh - 280px); overflow-y:auto; padding:1rem; }
.exam-detail-panel { min-height:500px; max-height:calc(100vh - 170px); overflow-y:auto; padding:2rem; border:1px solid var(--border-color); border-radius:var(--border-radius); background:var(--white); box-shadow:var(--shadow); color:var(--text-light); }
.exam-fullscreen-mode .exam-queue-layout { display:block; }
.exam-fullscreen-mode .exam-queue-sidebar { display:none; }
.exam-fullscreen-mode .exam-detail-panel { min-height:calc(100vh - 150px); max-height:none; padding:1.5rem clamp(1rem, 4vw, 4rem); border:0; box-shadow:none; }
.exam-fullscreen-mode .exam-form { max-width:1500px; margin:0 auto; }
.exam-fullscreen-mode .exam-form__header { position:sticky; top:0; z-index:5; padding:1rem 0; background:var(--white); }
.exam-fullscreen-mode .exam-form__footer { position:sticky; bottom:0; z-index:5; margin:0 -1rem; padding:1rem; background:rgba(255,255,255,.96); box-shadow:0 -8px 20px rgba(15,23,42,.08); }
.exam-header-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.55rem; }
.exam-header-actions .btn { width:auto; }
.exam-patient-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:.75rem; padding:1rem; margin:1rem 0; border:1px solid var(--border-color); border-radius:10px; background:#f8fafc; }
.exam-patient-grid label, .exam-detail-fields label { display:flex; flex-direction:column; gap:.35rem; color:var(--text-light); font-size:.8rem; font-weight:700; }
.exam-patient-grid input, .exam-detail-fields input, .exam-detail-fields textarea, .exam-detail-fields select { width:100%; box-sizing:border-box; padding:.62rem .7rem; border:1px solid var(--border-color); border-radius:7px; color:var(--text-color); font:inherit; background:var(--white); }
.exam-detail-fields { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.85rem; }
.exam-detail-fields textarea { min-height:78px; resize:vertical; }
.exam-detail-fields .span-2 { grid-column:span 2; }
.exam-detail-fields .span-4 { grid-column:1/-1; }
.exam-section-subtitle { margin:0 0 .8rem; color:var(--primary-color); font-size:1rem; }
.exam-choice-row { display:flex; flex-wrap:wrap; gap:1rem; align-items:center; }
.exam-choice-row label { display:flex; flex-direction:row; align-items:center; gap:.35rem; color:var(--text-color); font-size:.85rem; font-weight:600; }
.exam-tab-strip { display:flex; gap:.35rem; margin:1rem 0 0; border-bottom:1px solid var(--border-color); }
.exam-tab-strip button { padding:.7rem 1rem; border:0; border-bottom:3px solid transparent; background:transparent; color:var(--text-light); font-weight:700; cursor:pointer; }
.exam-tab-strip button.active { border-bottom-color:var(--primary-color); color:var(--primary-color); }
.exam-form { width:100%; color:var(--text-color); text-align:left; }
.exam-form section { padding:1.15rem 0; border-bottom:1px solid var(--border-color); }
.exam-result-card { margin:1.15rem 0; padding:1.15rem !important; border:1px solid #bae6fd !important; border-radius:14px; background:linear-gradient(135deg,#f0f9ff 0%,#fff 72%); box-shadow:0 8px 24px rgba(14,116,144,.08); }
.exam-result-card .exam-section-heading { align-items:center; }
.exam-result-card .exam-section-heading h4 { margin:.12rem 0; color:#0e7490; font-size:1.08rem; }
.exam-result-meta { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.65rem; margin:.9rem 0; }
.exam-result-meta div { padding:.7rem; border:1px solid #e0f2fe; border-radius:9px; background:rgba(255,255,255,.82); }
.exam-result-meta span,.exam-result-conclusion span { display:block; margin-bottom:.2rem; color:var(--text-light); font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.03em; }
.exam-result-meta strong { font-size:.9rem; }
.exam-result-list { display:grid; gap:.7rem; }
.exam-result-list article { display:grid; grid-template-columns:minmax(220px,.8fr) minmax(0,2fr); gap:1rem; padding:.85rem; border:1px solid var(--border-color); border-radius:10px; background:var(--white); }
.exam-result-list article small { display:block; margin-top:.2rem; color:var(--text-light); }
.exam-result-list article p,.exam-result-conclusion p { margin:0; white-space:pre-wrap; line-height:1.55; }
.exam-result-conclusion { margin-top:.8rem; padding:.9rem; border-left:4px solid #0891b2; border-radius:8px; background:#ecfeff; }
.exam-form h4 { margin:0 0 .8rem; font-size:1rem; }
.exam-form__header { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; padding-bottom:1rem; border-bottom:1px solid var(--border-color); }
.exam-form__header h3 { margin:.1rem 0; font-size:1.45rem; color:var(--primary-color); }
.exam-form__header p { margin:.25rem 0; color:var(--text-light); }
.eyebrow { margin:0; color:var(--primary-color)!important; font-size:.75rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }
.exam-patient-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; padding:1rem; margin:1rem 0; border-radius:10px; background:var(--secondary-color); }
.exam-patient-summary span { display:block; margin-bottom:.3rem; color:var(--text-light); font-size:.78rem; }
.exam-patient-summary strong { font-size:.9rem; }
.exam-vitals-grid, .exam-clinical-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.9rem; }
.exam-vitals-grid label, .exam-clinical-grid label { display:flex; flex-direction:column; gap:.35rem; color:var(--text-light); font-size:.85rem; font-weight:600; }
.exam-vitals-grid input, .exam-clinical-grid input, .exam-clinical-grid textarea, .exam-line input { width:100%; box-sizing:border-box; padding:.65rem .7rem; border:1px solid var(--border-color); border-radius:7px; color:var(--text-color); font:inherit; background:var(--white); }
.exam-clinical-grid textarea { resize:vertical; min-height:82px; }
.exam-section-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-bottom:.75rem; }
.exam-section-heading p { margin:.2rem 0 0; color:var(--text-light); font-size:.85rem; }
.exam-section-heading .btn { width:auto; }
.exam-template-actions { display:flex; align-items:center; justify-content:flex-end; gap:.55rem; flex-wrap:wrap; }
.exam-template-actions select { min-width:210px; padding:.64rem .7rem; border:1px solid var(--border-color); border-radius:7px; background:var(--white); color:var(--text-color); font:inherit; }

.role-permission-group { margin-bottom:1rem; overflow:hidden; border:1px solid var(--border-color); border-radius:10px; background:var(--white); }
.role-permission-group__header { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.8rem 1rem; background:var(--surface-hover); color:var(--primary); }
.role-permission-group__header label { display:flex; align-items:center; gap:.45rem; color:var(--text-color); font-size:.86rem; cursor:pointer; }
.role-permission-matrix { overflow-x:auto; }
.role-permission-row { display:grid; grid-template-columns:minmax(210px,2fr) repeat(7,minmax(70px,.65fr)); min-width:760px; border-top:1px solid var(--border-color); }
.role-permission-row > * { display:flex; align-items:center; justify-content:center; min-height:44px; padding:.45rem .55rem; border-left:1px solid var(--border-color); box-sizing:border-box; text-align:center; }
.role-permission-row > :first-child { justify-content:flex-start; border-left:0; text-align:left; }
.role-permission-row label { cursor:pointer; }
.role-permission-row label span { display:none; }
.role-permission-row--head { border-top:0; background:#f8fafc; color:var(--text-light); font-size:.75rem; font-weight:800; text-transform:uppercase; }
.feature-permission-notice { margin:.8rem 0 1rem; padding:.75rem .9rem; border:1px solid #bfdbfe; border-radius:8px; background:#eff6ff; color:#1d4ed8; font-size:.88rem; }
.feature-create-only .partner-filter-bar,
.feature-create-only .table-container,
.feature-create-only .grooming-board,
.feature-create-only .hotel-layout,
.feature-create-only .hotel-status-tabs,
.feature-create-only .pharmacy-tabs,
.feature-create-only .pharmacy-panel,
.feature-create-only .cashier-tabs,
.feature-create-only .cashier-panel { display:none !important; }
.exam-line { display:grid; gap:.6rem; align-items:center; margin:.55rem 0; }
.exam-order-line { grid-template-columns:.75fr 1.4fr 1fr .45fr 1fr .75fr 1.2fr auto; }
.exam-prescription-line { grid-template-columns:.65fr 1.35fr .42fr .65fr .45fr .55fr .55fr .55fr .55fr .8fr 1fr auto; }
.exam-line-head { display:grid; gap:.6rem; align-items:end; margin:1rem 0 .2rem; color:var(--text-light); font-size:.72rem; font-weight:800; text-transform:uppercase; }
.exam-line-head span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.exam-order-meta, .exam-prescription-meta { margin:.75rem 0; padding:.85rem; border-radius:8px; background:#f8fafc; }
.exam-line .icon-btn { width:32px; height:32px; border-radius:7px; border:1px solid #fecaca; color:var(--danger); font-size:1.25rem; }
.exam-form__footer { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.75rem; padding-top:1.25rem; }
.exam-form__footer .btn { width:auto; }
.medical-record-list { display:flex; flex-direction:column; gap:.75rem; }
.medical-record-card { display:grid; grid-template-columns:1.2fr 1fr auto; align-items:center; gap:1rem; padding:1rem 1.25rem; border:1px solid var(--border-color); border-radius:10px; background:var(--white); box-shadow:var(--shadow); }
.medical-record-card h3 { margin:.2rem 0; color:var(--primary-color); }
.medical-record-card p { margin:.2rem 0; color:var(--text-light); font-size:.88rem; }
.medical-record-card .btn { width:auto; }
.exam-statistics-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1rem; }
.exam-stat-card { padding:1.25rem; border:1px solid var(--border-color); border-radius:10px; background:var(--white); box-shadow:var(--shadow); }
.exam-stat-card span { display:block; color:var(--text-light); font-size:.9rem; }
.exam-stat-card strong { display:block; margin-top:.5rem; color:var(--primary-color); font-size:2rem; }
@media (max-width:900px) {
    #partner-reception-form { grid-template-columns:1fr !important; }
    .partner-filter-bar { align-items:stretch; flex-direction:column; }
    .partner-filter-bar > * { width:100%; }
    .partner-page-heading { align-items:flex-start; }
    .reception-detail-grid { grid-template-columns:1fr; }
    .exam-patient-summary, .exam-patient-grid, .exam-vitals-grid, .exam-clinical-grid, .exam-detail-fields, .medical-record-card { grid-template-columns:1fr; }
    .exam-detail-fields .span-2, .exam-detail-fields .span-4 { grid-column:auto; }
    .exam-order-line, .exam-prescription-line { grid-template-columns:1fr; }
    .exam-section-heading { flex-direction:column; }
    .exam-result-meta { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .exam-result-list article { grid-template-columns:1fr; gap:.45rem; }
    .exam-template-actions { width:100%; justify-content:flex-start; }
    .exam-template-actions select { min-width:0; width:100%; }
}

/* --- STATUS BADGE --- */
.status-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    white-space: nowrap;
}

.status-active {
    background-color: #dcfce7;
    color: #166534;
    border: 1px solid #bbf7d0;
}

.status-inactive {
    background-color: #f1f5f9;
    color: #475569;
    border: 1px solid #e2e8f0;
}

/* --- DASHBOARD VIEW --- */
.dashboard-kpi-card { background: var(--white); border: 1px solid var(--border-color); border-radius: var(--border-radius); padding: 1.5rem; display: flex; align-items: center; gap: 1rem; box-shadow: var(--shadow); transition: transform var(--transition-speed); }
.dashboard-kpi-card:hover { transform: translateY(-3px); }
.kpi-icon { width: 48px; height: 48px; background: var(--primary-light); color: var(--primary-color); border-radius: 50%; display: flex; justify-content: center; align-items: center; }
.kpi-info { display: flex; flex-direction: column; }
.kpi-label { font-size: 0.9rem; color: var(--text-light); font-weight: 500; margin-bottom: 0.25rem; }
.kpi-value { font-size: 1.5rem; font-weight: 700; color: var(--text-color); margin: 0; }
.chart-container-box { background: var(--white); border: 1px solid var(--border-color); border-radius: var(--border-radius); padding: 1.5rem; box-shadow: var(--shadow); }
.chart-container-box h3 { margin-top: 0; margin-bottom: 1rem; font-size: 1.1rem; color: var(--primary-color); }

/* --- INPATIENT MODULE --- */
.partner-heading-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:.65rem; }
.partner-heading-actions .btn { width:auto; }
.partner-heading-actions input[type="date"] { min-height:38px; padding:.45rem .65rem; border:1px solid var(--border-color); border-radius:7px; color:var(--text-color); font:inherit; }
.inpatient-ward-board { display:flex; flex-direction:column; gap:1.5rem; margin-top:1.25rem; }
.inpatient-area { padding:1.15rem; border:1px solid var(--border-color); border-radius:12px; background:var(--secondary-color); }
.inpatient-area__title { margin:0 0 1rem; color:var(--primary-color); font-size:1.05rem; }
.inpatient-area__grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:1rem; }
.inpatient-ward-card { min-height:185px; display:flex; flex-direction:column; gap:.85rem; padding:1rem; border:1px solid #c7d2fe; border-radius:11px; background:var(--white); box-shadow:var(--shadow); }
.inpatient-ward-card--maintenance { border-color:#fde68a; background:#fffbeb; }
.inpatient-ward-card--inactive { border-color:#cbd5e1; background:#f8fafc; opacity:.8; }
.inpatient-ward-card__header { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
.inpatient-ward-card__header h4 { margin:.2rem 0 0; color:var(--text-color); font-size:1.05rem; }
.inpatient-ward-card__meta { display:flex; justify-content:space-between; gap:.5rem; color:var(--text-light); font-size:.83rem; }
.inpatient-ward-card__patients { display:flex; flex-direction:column; gap:.45rem; min-height:40px; }
.inpatient-patient-chip { display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding:.45rem .6rem; border-radius:7px; background:#eef2ff; color:#3730a3; font-size:.82rem; }
.inpatient-patient-chip span { color:#6366f1; font-size:.75rem; }
.inpatient-ward-card__footer { display:flex; align-items:center; justify-content:space-between; gap:.75rem; margin-top:auto; }
.inpatient-ward-card__footer small { max-width:55%; overflow:hidden; color:var(--text-light); font-size:.75rem; text-overflow:ellipsis; white-space:nowrap; }
.inpatient-ward-card .icon-btn { width:31px; height:31px; border:1px solid var(--border-color); border-radius:7px; background:var(--white); color:var(--primary-color); cursor:pointer; }
.partner-status.warning { background:#fef3c7; color:#92400e; }
.partner-status.in_progress { background:#dbeafe; color:#1d4ed8; }
.partner-status.completed { background:#dcfce7; color:#166534; }
.partner-status.pending { background:#fef3c7; color:#92400e; }
.partner-status.discharged { background:#e2e8f0; color:#475569; }
.partner-status.cancelled { background:#fee2e2; color:#b91c1c; }
.form-help { display:block; margin-top:.35rem; color:var(--text-light); font-size:.78rem; }
.table-subtext { display:block; margin-top:.2rem; color:var(--text-light); font-size:.75rem; }
.empty-table { padding:2rem!important; color:var(--text-light); text-align:center; }
.empty-table.error { color:var(--danger); }
.stock-lines-section { margin:1.1rem 0; padding:1rem; border:1px solid var(--border-color); border-radius:10px; background:#f8fafc; }
.stock-lines-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-bottom:.8rem; }
.stock-lines-heading h4 { margin:0; color:var(--text-color); }
.stock-lines-heading p { margin:.25rem 0 0; color:var(--text-light); font-size:.82rem; }
.stock-lines-heading .btn { width:auto; }
.stock-lines-table { min-width:920px; }
.stock-lines-table input, .stock-lines-table select { width:100%; min-height:38px; box-sizing:border-box; padding:.45rem .55rem; border:1px solid var(--border-color); border-radius:7px; background:var(--white); color:var(--text-color); font:inherit; }
.stock-lines-table th:first-child, .stock-lines-table td:first-child { min-width:240px; }
.stock-lines-table .btn { width:34px; min-width:34px; padding:.35rem; }
.stock-document-total { display:flex; justify-content:flex-end; gap:.5rem; margin-top:.85rem; color:var(--text-light); }
.stock-document-total strong { color:var(--primary-color); font-size:1.05rem; }
@media (max-width:900px) { .partner-heading-actions { width:100%; justify-content:flex-start; } .inpatient-area__grid { grid-template-columns:1fr; } }

/* --- WORKFLOW VIEW --- */
.workflow-step-item { background: var(--white); border: 1px solid var(--border-color); border-radius: var(--border-radius); padding: 1rem 1.5rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; cursor: grab; transition: box-shadow var(--transition-speed); box-shadow: var(--shadow); }
.workflow-step-item:active { cursor: grabbing; box-shadow: var(--shadow-lg); }
.workflow-step-drag { color: var(--text-light); cursor: grab; }
.workflow-step-info { flex-grow: 1; display: flex; align-items: center; gap: 1rem; font-weight: 600; font-size: 1.1rem; }
.workflow-step-icon { color: var(--primary-color); }
.workflow-step-item { position:relative; cursor:default; min-height:92px; }
.workflow-step-drag { padding:12px; border-radius:10px; background:#f5f3ff; flex-shrink:0; }
.workflow-step-drag[draggable="false"] { cursor:default; opacity:.45; }
.workflow-step-info small { display:block; font-size:.82rem; font-weight:400; color:var(--text-light); line-height:1.5; }
.workflow-step-disabled { opacity:.65; background:#f8fafc; }
.workflow-move-buttons { display:flex; gap:6px; }
.workflow-move-buttons .btn { padding:8px 12px; }
.workflow-branch-guide { padding:16px; border:1px solid #ddd6fe; border-radius:12px; background:#f5f3ff; color:#4c1d95; margin-bottom:18px; line-height:1.6; }
.workflow-branch-guide p { margin:8px 0; }
.workflow-presets { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-bottom:12px; }
.workflow-presets .btn { width:auto; flex:1 1 240px; }
.workflow-step-drag { touch-action:none; user-select:none; }
.workflow-branch-guide summary { cursor:pointer; font-weight:600; }
.workflow-drop-before::before, .workflow-drop-after::after { content:attr(data-drop-label); position:absolute; left:0; right:0; z-index:10; border-top:4px solid #7c3aed; color:#5b21b6; background:#f5f3ff; font-size:.8rem; font-weight:600; padding:3px 12px; border-radius:4px; pointer-events:none; box-shadow:0 2px 8px #7c3aed33; }
.workflow-drop-before::before { top:-15px; }
.workflow-drop-after::after { bottom:-22px; }
.workflow-drop-invalid::before, .workflow-drop-invalid::after { border-color:#dc2626; color:#991b1b; background:#fef2f2; }
@media(max-width:700px) { .workflow-step-item { padding:12px; gap:8px; flex-wrap:wrap; } .workflow-step-info { font-size:.95rem; } .workflow-step-drag { padding:8px; } }
.catalog-manager { overflow:hidden; padding:0 !important; border:1px solid #e5eaf2; box-shadow:0 2px 8px rgba(15,23,42,.03); }
.catalog-manager .system-catalog-card__header { padding:24px 24px 16px; margin:0; }
.catalog-manager .system-catalog-card__header h3 { font-size:1.15rem; color:#1e293b; }
.catalog-manager .system-catalog-card__header p { color:#64748b; font-size:.85rem; margin-top:6px; }
.catalog-manager .system-catalog-card__header .btn { width:auto; white-space:nowrap; padding:10px 18px; }
.catalog-filterbar { display:flex; flex-wrap:wrap; gap:12px; padding:0 24px 20px; }
.catalog-filterbar input,.catalog-filterbar select { border:1px solid #dbe2ec; background:white; border-radius:8px; padding:10px 12px; min-height:42px; color:#334155; }
.catalog-filterbar input { flex:1; min-width:200px; }
.catalog-manager .table-container { margin:0 24px; }
.catalog-manager .system-catalog-table th { background:#f1f5f9; color:#475569; font-size:.82rem; font-weight:600; padding:14px 16px; text-transform:none; white-space:nowrap; }
.catalog-manager .system-catalog-table td { padding:18px 16px; border-bottom:1px solid #edf1f6; color:#334155; font-size:.88rem; }
.catalog-manager .system-catalog-table tbody tr:hover { background:#fafbff; }
.catalog-action { background:transparent; border:0; color:#6d28d9; cursor:pointer; padding:8px; border-radius:6px; font-weight:500; }
.catalog-action:hover { background:#f3e8ff; }
.catalog-action-danger { color:#e11d48; }
.catalog-status { display:inline-block; padding:4px 10px; border-radius:20px; font-size:.78rem; white-space:nowrap; }
.catalog-status.active { color:#047857; background:#ecfdf5; }
.catalog-status.inactive { color:#64748b; background:#f1f5f9; }
.catalog-pagination { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; padding:20px 24px; color:#64748b; font-size:.82rem; }
.catalog-pagination div { display:flex; align-items:center; gap:12px; }
.catalog-pagination button,.catalog-pagination select { padding:7px 10px; border:1px solid #e2e8f0; border-radius:6px; background:white; color:#475569; }
.catalog-pagination button:disabled { opacity:.35; cursor:not-allowed; }
.catalog-section-tabs { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:18px; }
.catalog-section-tabs button { background:white; color:#475569; border:1px solid #e2e8f0; border-radius:9px; padding:12px 16px; cursor:pointer; font-weight:500; }
.catalog-section-tabs button.active { color:#6d28d9; background:#f5f3ff; border-color:#c4b5fd; }
.catalog-section-tabs span { margin-left:8px; font-size:.75rem; background:#f1f5f9; padding:2px 7px; border-radius:12px; }
@media(max-width:700px) { .catalog-filterbar,.catalog-manager .system-catalog-card__header,.catalog-pagination { padding:16px; } .catalog-manager .table-container { margin:0 16px; } .catalog-filterbar select { flex:1; } .catalog-pagination div { flex-wrap:wrap; } }
.partner-dialog .system-catalog-check { display:flex; align-items:center; justify-content:flex-start; gap:10px; grid-column:1/-1; padding:12px 0; }
.partner-dialog .system-catalog-check input[type="checkbox"] { width:18px; height:18px; margin:0; flex:none; }
.catalog-filterbar input { width:auto; flex:1 1 300px; }
.catalog-filterbar select { width:auto; flex:0 1 240px; }
.catalog-detail-section { grid-column:1/-1; padding:20px; border:1px solid #e2e8f0; border-radius:10px; background:#f8fafc; }
.catalog-detail-section header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:16px; }
.catalog-detail-section h4 { margin:0 0 6px; color:#1e293b; }
.catalog-detail-section p { font-size:.82rem; color:#64748b; margin:0; }
.catalog-detail-section .btn { width:auto; white-space:nowrap; }
.catalog-detail-section footer { display:flex; justify-content:flex-end; gap:8px; margin-top:16px; color:#475569; }
.catalog-detail-section .table-container { margin:0; }
.catalog-detail-table { min-width:720px; }
.catalog-detail-table th:first-child { min-width:240px; }
.catalog-detail-table input,.catalog-detail-table select { width:100%; min-width:80px; padding:9px 10px; border:1px solid #dbe2ec; border-radius:7px; background:white; box-sizing:border-box; font:inherit; }
.catalog-detail-table [data-template-dose],.catalog-detail-table [data-template-instruction] { min-width:150px; }
.catalog-line-warning { display:block; color:#b45309; margin-top:6px; }
#partner-system-catalog-editor .catalog-editor-wide { width:min(1120px,96vw); max-width:1120px; }
@media(max-width:700px) { .catalog-detail-section { padding:12px; } .catalog-detail-section header { flex-direction:column; } }
[data-exam-page][hidden] { display: none !important; }
.exam-tab-strip [role="tab"]:focus-visible { outline: 2px solid #7c3aed; outline-offset: -3px; }
.exam-catalog-picker { padding: 1rem; margin: 1rem 0; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 12px; }
.exam-catalog-filters { display: grid; grid-template-columns: 2fr 1fr; gap: 1rem; }
.exam-catalog-filters label { display: grid; gap: .4rem; font-size: .85rem; font-weight: 600; }
.exam-catalog-filters input, .exam-catalog-filters select { padding: .7rem; border: 1px solid #dbe1e8; border-radius: 8px; background: white; width: 100%; }
.exam-catalog-results { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .5rem; max-height: 260px; overflow: auto; margin-top: .8rem; }
.exam-catalog-product { display: flex; justify-content: space-between; align-items: center; gap: .6rem; padding: .7rem; border: 1px solid #e2e8f0; border-radius: 8px; background: white; text-align: left; cursor: pointer; color: #334155; }
.exam-catalog-product:hover { border-color: #7c3aed; background: #faf5ff; }
.exam-catalog-product strong, .exam-catalog-product small { display: block; }
.exam-catalog-product small { margin-top: .2rem; color: #64748b; }
.exam-catalog-product > span:last-child { white-space: nowrap; font-size: .8rem; }
@media (max-width: 760px) { .exam-catalog-filters, .exam-catalog-results { grid-template-columns: 1fr; } }
.paraclinical-tabs { display:flex; gap:.25rem; border-bottom:1px solid #e2e8f0; margin:1rem 0; }
.paraclinical-tabs button { border:0; border-bottom:3px solid transparent; background:transparent; padding:.8rem 1rem; font-weight:600; color:#64748b; cursor:pointer; }
.paraclinical-tabs button.active { color:#7c3aed; border-bottom-color:#7c3aed; }
[data-cls-panel][hidden] { display:none !important; }
#partner-cashflow-panel > .modal-form-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 1rem;
}
#partner-cashflow-panel .system-config-card h2 { margin: .75rem 0 0; }
#partner-cashflow-panel .table { min-width: 1300px; }
#partner-cashflow-panel .table th,
#partner-cashflow-panel .table td { white-space: nowrap; }
#partner-cashflow-panel .table td:nth-child(5) {
    white-space: normal;
    min-width: 260px;
    max-width: 360px;
    overflow-wrap: anywhere;
}
@media (max-width: 760px) {
    #partner-cashflow-panel > .modal-form-grid { grid-template-columns: 1fr; }
}