react-admin-crud-manager 1.0.0

package/src/components/Table/components/ImagePreview.jsx

@@ -0,0 +1,58 @@
+import { useEffect } from "react";
+import { X } from "lucide-react";
+
+const ImagePreview = ({ src, alt = "preview", isOpen, setIsOpen }) => {
+  const closePreview = () => setIsOpen(false);
+
+  // Handle ESC key + prevent body scroll
+  useEffect(() => {
+    const handleEsc = (e) => {
+      if (e.key === "Escape") closePreview();
+    };
+
+    if (isOpen) {
+      document.body.style.overflow = "hidden";
+      document.addEventListener("keydown", handleEsc);
+    }
+
+    return () => {
+      document.body.style.overflow = "";
+      document.removeEventListener("keydown", handleEsc);
+    };
+  }, [isOpen]);
+
+  return (
+    <>
+      {/* Fullscreen Preview */}
+      <div
+        className="fixed inset-0 z-50 flex items-center justify-center bg-black/70 dark:bg-black/80 
+                   backdrop-blur-sm animate-in fade-in duration-200"
+        onClick={closePreview}
+      >
+        {/* Close Button */}
+        <button
+          onClick={closePreview}
+          className="absolute top-4 right-4 bg-white dark:bg-gray-800 text-gray-800 dark:text-gray-200
+                     hover:bg-gray-100 dark:hover:bg-gray-700 rounded-full p-2 shadow-lg transition"
+        >
+          <X size={20} />
+        </button>
+
+        {/* Image Container */}
+        <div
+          className="max-w-5xl w-full px-4 transform transition-all duration-200 scale-95 animate-in zoom-in-95"
+          onClick={(e) => e.stopPropagation()}
+        >
+          {/* Large Image */}
+          <img
+            src={src}
+            alt={alt}
+            className="w-full max-h-[90vh] object-contain rounded-xl"
+          />
+        </div>
+      </div>
+    </>
+  );
+};
+
+export default ImagePreview;

package/src/components/Table/components/TableSkeleton.jsx

@@ -0,0 +1,39 @@
+const TableSkeleton = ({ rows = 5, columns = 5 }) => {
+  return (
+    <>
+      <div className="w-full mb-6 inline-flex justify-end items-center">
+        <div className="h-8 w-80 bg-gray-300 dark:bg-gray-700 rounded animate-pulse" />
+      </div>
+      <div className="overflow-hidden rounded-md border border-gray-200 dark:border-gray-800">
+        <table className="w-full border-collapse">
+          <thead>
+            <tr className="bg-gray-50 dark:bg-gray-900">
+              {Array.from({ length: columns }).map((_, i) => (
+                <th key={i} className="px-4 py-3">
+                  <div className="h-6 w-24 bg-gray-300 dark:bg-gray-700 rounded animate-pulse  inline-flex justify-center items-center" />
+                </th>
+              ))}
+            </tr>
+          </thead>
+
+          <tbody>
+            {Array.from({ length: rows }).map((_, rowIndex) => (
+              <tr
+                key={rowIndex}
+                className="border-t border-gray-200 dark:border-gray-800"
+              >
+                {Array.from({ length: columns }).map((_, colIndex) => (
+                  <td key={colIndex} className="px-4 py-6">
+                    <div className="h-6 w-full bg-gray-300 dark:bg-gray-700 rounded animate-pulse" />
+                  </td>
+                ))}
+              </tr>
+            ))}
+          </tbody>
+        </table>
+      </div>
+    </>
+  );
+};
+
+export default TableSkeleton;

package/src/data/countries.js

@@ -0,0 +1,252 @@
+export const countries = [
+  { label: "Afghanistan", code: "AF", phone: "93" },
+  { label: "Aland Islands", code: "AX", phone: "358" },
+  { label: "Albania", code: "AL", phone: "355" },
+  { label: "Algeria", code: "DZ", phone: "213" },
+  { label: "American Samoa", code: "AS", phone: "1" },
+  { label: "Andorra", code: "AD", phone: "376" },
+  { label: "Angola", code: "AO", phone: "244" },
+  { label: "Anguilla", code: "AI", phone: "1" },
+  { label: "Antarctica", code: "AQ", phone: "672" },
+  { label: "Antigua and Barbuda", code: "AG", phone: "1" },
+  { label: "Argentina", code: "AR", phone: "54" },
+  { label: "Armenia", code: "AM", phone: "374" },
+  { label: "Aruba", code: "AW", phone: "297" },
+  { label: "Australia", code: "AU", phone: "61" },
+  { label: "Austria", code: "AT", phone: "43" },
+  { label: "Azerbaijan", code: "AZ", phone: "994" },
+  { label: "Bahrain", code: "BH", phone: "973" },
+  { label: "Bangladesh", code: "BD", phone: "880" },
+  { label: "Barbados", code: "BB", phone: "1" },
+  { label: "Belarus", code: "BY", phone: "375" },
+  { label: "Belgium", code: "BE", phone: "32" },
+  { label: "Belize", code: "BZ", phone: "501" },
+  { label: "Benin", code: "BJ", phone: "229" },
+  { label: "Bermuda", code: "BM", phone: "1" },
+  { label: "Bhutan", code: "BT", phone: "975" },
+  { label: "Bolivia", code: "BO", phone: "591" },
+  { label: "Bonaire, Sint Eustatius and Saba", code: "BQ", phone: "599" },
+  { label: "Bosnia and Herzegovina", code: "BA", phone: "387" },
+  { label: "Botswana", code: "BW", phone: "267" },
+  { label: "Bouvet Island", code: "BV", phone: "0055" },
+  { label: "Brazil", code: "BR", phone: "55" },
+  { label: "British Indian Ocean Territory", code: "IO", phone: "246" },
+  { label: "Brunei", code: "BN", phone: "673" },
+  { label: "Bulgaria", code: "BG", phone: "359" },
+  { label: "Burkina Faso", code: "BF", phone: "226" },
+  { label: "Burundi", code: "BI", phone: "257" },
+  { label: "Cambodia", code: "KH", phone: "855" },
+  { label: "Cameroon", code: "CM", phone: "237" },
+  { label: "Canada", code: "CA", phone: "1" },
+  { label: "Cape Verde", code: "CV", phone: "238" },
+  { label: "Cayman Islands", code: "KY", phone: "1" },
+  { label: "Central African Republic", code: "CF", phone: "236" },
+  { label: "Chad", code: "TD", phone: "235" },
+  { label: "Chile", code: "CL", phone: "56" },
+  { label: "China", code: "CN", phone: "86" },
+  { label: "Christmas Island", code: "CX", phone: "61" },
+  { label: "Cocos (Keeling) Islands", code: "CC", phone: "61" },
+  { label: "Colombia", code: "CO", phone: "57" },
+  { label: "Comoros", code: "KM", phone: "269" },
+  { label: "Congo", code: "CG", phone: "242" },
+  { label: "Cook Islands", code: "CK", phone: "682" },
+  { label: "Costa Rica", code: "CR", phone: "506" },
+  { label: "Croatia", code: "HR", phone: "385" },
+  { label: "Cuba", code: "CU", phone: "53" },
+  { label: "Curaçao", code: "CW", phone: "599" },
+  { label: "Cyprus", code: "CY", phone: "357" },
+  { label: "Czech Republic", code: "CZ", phone: "420" },
+  { label: "Democratic Republic of the Congo", code: "CD", phone: "243" },
+  { label: "Denmark", code: "DK", phone: "45" },
+  { label: "Djibouti", code: "DJ", phone: "253" },
+  { label: "Dominica", code: "DM", phone: "1" },
+  { label: "Dominican Republic", code: "DO", phone: "1" },
+  { label: "Ecuador", code: "EC", phone: "593" },
+  { label: "Egypt", code: "EG", phone: "20" },
+  { label: "El Salvador", code: "SV", phone: "503" },
+  { label: "Equatorial Guinea", code: "GQ", phone: "240" },
+  { label: "Eritrea", code: "ER", phone: "291" },
+  { label: "Estonia", code: "EE", phone: "372" },
+  { label: "Eswatini", code: "SZ", phone: "268" },
+  { label: "Ethiopia", code: "ET", phone: "251" },
+  { label: "Falkland Islands", code: "FK", phone: "500" },
+  { label: "Faroe Islands", code: "FO", phone: "298" },
+  { label: "Fiji Islands", code: "FJ", phone: "679" },
+  { label: "Finland", code: "FI", phone: "358" },
+  { label: "France", code: "FR", phone: "33" },
+  { label: "French Guiana", code: "GF", phone: "594" },
+  { label: "French Polynesia", code: "PF", phone: "689" },
+  { label: "French Southern Territories", code: "TF", phone: "262" },
+  { label: "Gabon", code: "GA", phone: "241" },
+  { label: "Georgia", code: "GE", phone: "995" },
+  { label: "Germany", code: "DE", phone: "49" },
+  { label: "Ghana", code: "GH", phone: "233" },
+  { label: "Gibraltar", code: "GI", phone: "350" },
+  { label: "Greece", code: "GR", phone: "30" },
+  { label: "Greenland", code: "GL", phone: "299" },
+  { label: "Grenada", code: "GD", phone: "1" },
+  { label: "Guadeloupe", code: "GP", phone: "590" },
+  { label: "Guam", code: "GU", phone: "1" },
+  { label: "Guatemala", code: "GT", phone: "502" },
+  { label: "Guernsey", code: "GG", phone: "44" },
+  { label: "Guinea", code: "GN", phone: "224" },
+  { label: "Guinea-Bissau", code: "GW", phone: "245" },
+  { label: "Guyana", code: "GY", phone: "592" },
+  { label: "Haiti", code: "HT", phone: "509" },
+  { label: "Heard Island and McDonald Islands", code: "HM", phone: "672" },
+  { label: "Honduras", code: "HN", phone: "504" },
+  { label: "Hong Kong S.A.R.", code: "HK", phone: "852" },
+  { label: "Hungary", code: "HU", phone: "36" },
+  { label: "Iceland", code: "IS", phone: "354" },
+  { label: "India", code: "IN", phone: "91" },
+  { label: "Indonesia", code: "ID", phone: "62" },
+  { label: "Iran", code: "IR", phone: "98" },
+  { label: "Iraq", code: "IQ", phone: "964" },
+  { label: "Ireland", code: "IE", phone: "353" },
+  { label: "Israel", code: "IL", phone: "972" },
+  { label: "Italy", code: "IT", phone: "39" },
+  { label: "Ivory Coast", code: "CI", phone: "225" },
+  { label: "Jamaica", code: "JM", phone: "1" },
+  { label: "Japan", code: "JP", phone: "81" },
+  { label: "Jersey", code: "JE", phone: "44" },
+  { label: "Jordan", code: "JO", phone: "962" },
+  { label: "Kazakhstan", code: "KZ", phone: "7" },
+  { label: "Kenya", code: "KE", phone: "254" },
+  { label: "Kiribati", code: "KI", phone: "686" },
+  { label: "Kosovo", code: "XK", phone: "383" },
+  { label: "Kuwait", code: "KW", phone: "965" },
+  { label: "Kyrgyzstan", code: "KG", phone: "996" },
+  { label: "Laos", code: "LA", phone: "856" },
+  { label: "Latvia", code: "LV", phone: "371" },
+  { label: "Lebanon", code: "LB", phone: "961" },
+  { label: "Lesotho", code: "LS", phone: "266" },
+  { label: "Liberia", code: "LR", phone: "231" },
+  { label: "Libya", code: "LY", phone: "218" },
+  { label: "Liechtenstein", code: "LI", phone: "423" },
+  { label: "Lithuania", code: "LT", phone: "370" },
+  { label: "Luxembourg", code: "LU", phone: "352" },
+  { label: "Macau S.A.R.", code: "MO", phone: "853" },
+  { label: "Madagascar", code: "MG", phone: "261" },
+  { label: "Malawi", code: "MW", phone: "265" },
+  { label: "Malaysia", code: "MY", phone: "60" },
+  { label: "Maldives", code: "MV", phone: "960" },
+  { label: "Mali", code: "ML", phone: "223" },
+  { label: "Malta", code: "MT", phone: "356" },
+  { label: "Man (Isle of)", code: "IM", phone: "44" },
+  { label: "Marshall Islands", code: "MH", phone: "692" },
+  { label: "Martinique", code: "MQ", phone: "596" },
+  { label: "Mauritania", code: "MR", phone: "222" },
+  { label: "Mauritius", code: "MU", phone: "230" },
+  { label: "Mayotte", code: "YT", phone: "262" },
+  { label: "Mexico", code: "MX", phone: "52" },
+  { label: "Micronesia", code: "FM", phone: "691" },
+  { label: "Moldova", code: "MD", phone: "373" },
+  { label: "Monaco", code: "MC", phone: "377" },
+  { label: "Mongolia", code: "MN", phone: "976" },
+  { label: "Montenegro", code: "ME", phone: "382" },
+  { label: "Montserrat", code: "MS", phone: "1" },
+  { label: "Morocco", code: "MA", phone: "212" },
+  { label: "Mozambique", code: "MZ", phone: "258" },
+  { label: "Myanmar", code: "MM", phone: "95" },
+  { label: "Namibia", code: "NA", phone: "264" },
+  { label: "Nauru", code: "NR", phone: "674" },
+  { label: "Nepal", code: "NP", phone: "977" },
+  { label: "Netherlands", code: "NL", phone: "31" },
+  { label: "New Caledonia", code: "NC", phone: "687" },
+  { label: "New Zealand", code: "NZ", phone: "64" },
+  { label: "Nicaragua", code: "NI", phone: "505" },
+  { label: "Niger", code: "NE", phone: "227" },
+  { label: "Nigeria", code: "NG", phone: "234" },
+  { label: "Niue", code: "NU", phone: "683" },
+  { label: "Norfolk Island", code: "NF", phone: "672" },
+  { label: "North Korea", code: "KP", phone: "850" },
+  { label: "North Macedonia", code: "MK", phone: "389" },
+  { label: "Northern Mariana Islands", code: "MP", phone: "1" },
+  { label: "Norway", code: "NO", phone: "47" },
+  { label: "Oman", code: "OM", phone: "968" },
+  { label: "Pakistan", code: "PK", phone: "92" },
+  { label: "Palau", code: "PW", phone: "680" },
+  { label: "Palestinian Territory Occupied", code: "PS", phone: "970" },
+  { label: "Panama", code: "PA", phone: "507" },
+  { label: "Papua New Guinea", code: "PG", phone: "675" },
+  { label: "Paraguay", code: "PY", phone: "595" },
+  { label: "Peru", code: "PE", phone: "51" },
+  { label: "Philippines", code: "PH", phone: "63" },
+  { label: "Pitcairn Island", code: "PN", phone: "870" },
+  { label: "Poland", code: "PL", phone: "48" },
+  { label: "Portugal", code: "PT", phone: "351" },
+  { label: "Puerto Rico", code: "PR", phone: "1" },
+  { label: "Qatar", code: "QA", phone: "974" },
+  { label: "Reunion", code: "RE", phone: "262" },
+  { label: "Romania", code: "RO", phone: "40" },
+  { label: "Russia", code: "RU", phone: "7" },
+  { label: "Rwanda", code: "RW", phone: "250" },
+  { label: "Saint Helena", code: "SH", phone: "290" },
+  { label: "Saint Kitts and Nevis", code: "KN", phone: "1" },
+  { label: "Saint Lucia", code: "LC", phone: "1" },
+  { label: "Saint Pierre and Miquelon", code: "PM", phone: "508" },
+  { label: "Saint Vincent and the Grenadines", code: "VC", phone: "1" },
+  { label: "Saint-Barthelemy", code: "BL", phone: "590" },
+  { label: "Saint-Martin (French part)", code: "MF", phone: "590" },
+  { label: "Samoa", code: "WS", phone: "685" },
+  { label: "San Marino", code: "SM", phone: "378" },
+  { label: "Sao Tome and Principe", code: "ST", phone: "239" },
+  { label: "Saudi Arabia", code: "SA", phone: "966" },
+  { label: "Senegal", code: "SN", phone: "221" },
+  { label: "Serbia", code: "RS", phone: "381" },
+  { label: "Seychelles", code: "SC", phone: "248" },
+  { label: "Sierra Leone", code: "SL", phone: "232" },
+  { label: "Singapore", code: "SG", phone: "65" },
+  { label: "Sint Maarten (Dutch part)", code: "SX", phone: "1721" },
+  { label: "Slovakia", code: "SK", phone: "421" },
+  { label: "Slovenia", code: "SI", phone: "386" },
+  { label: "Solomon Islands", code: "SB", phone: "677" },
+  { label: "Somalia", code: "SO", phone: "252" },
+  { label: "South Africa", code: "ZA", phone: "27" },
+  { label: "South Georgia", code: "GS", phone: "500" },
+  { label: "South Korea", code: "KR", phone: "82" },
+  { label: "South Sudan", code: "SS", phone: "211" },
+  { label: "Spain", code: "ES", phone: "34" },
+  { label: "Sri Lanka", code: "LK", phone: "94" },
+  { label: "Sudan", code: "SD", phone: "249" },
+  { label: "Suriname", code: "SR", phone: "597" },
+  { label: "Svalbard and Jan Mayen Islands", code: "SJ", phone: "47" },
+  { label: "Sweden", code: "SE", phone: "46" },
+  { label: "Switzerland", code: "CH", phone: "41" },
+  { label: "Syria", code: "SY", phone: "963" },
+  { label: "Taiwan", code: "TW", phone: "886" },
+  { label: "Tajikistan", code: "TJ", phone: "992" },
+  { label: "Tanzania", code: "TZ", phone: "255" },
+  { label: "Thailand", code: "TH", phone: "66" },
+  { label: "The Bahamas", code: "BS", phone: "1" },
+  { label: "The Gambia", code: "GM", phone: "220" },
+  { label: "Timor-Leste", code: "TL", phone: "670" },
+  { label: "Togo", code: "TG", phone: "228" },
+  { label: "Tokelau", code: "TK", phone: "690" },
+  { label: "Tonga", code: "TO", phone: "676" },
+  { label: "Trinidad and Tobago", code: "TT", phone: "1" },
+  { label: "Tunisia", code: "TN", phone: "216" },
+  { label: "Turkey", code: "TR", phone: "90" },
+  { label: "Turkmenistan", code: "TM", phone: "993" },
+  { label: "Turks and Caicos Islands", code: "TC", phone: "1" },
+  { label: "Tuvalu", code: "TV", phone: "688" },
+  { label: "Uganda", code: "UG", phone: "256" },
+  { label: "Ukraine", code: "UA", phone: "380" },
+  { label: "United Arab Emirates", code: "AE", phone: "971" },
+  { label: "United Kingdom", code: "GB", phone: "44" },
+  { label: "United States", code: "US", phone: "1" },
+  { label: "United States Minor Outlying Islands", code: "UM", phone: "1" },
+  { label: "Uruguay", code: "UY", phone: "598" },
+  { label: "Uzbekistan", code: "UZ", phone: "998" },
+  { label: "Vanuatu", code: "VU", phone: "678" },
+  { label: "Vatican City State (Holy See)", code: "VA", phone: "379" },
+  { label: "Venezuela", code: "VE", phone: "58" },
+  { label: "Vietnam", code: "VN", phone: "84" },
+  { label: "Virgin Islands (British)", code: "VG", phone: "1" },
+  { label: "Virgin Islands (US)", code: "VI", phone: "1" },
+  { label: "Wallis and Futuna Islands", code: "WF", phone: "681" },
+  { label: "Western Sahara", code: "EH", phone: "212" },
+  { label: "Yemen", code: "YE", phone: "967" },
+  { label: "Zambia", code: "ZM", phone: "260" },
+  { label: "Zimbabwe", code: "ZW", phone: "263" },
+];

package/src/data/teams.js

@@ -0,0 +1,130 @@
+export const mockData = {
+  data: [
+    {
+      id: 1,
+      first_name: "John",
+      last_name: "Doe",
+      email: "john@example.com",
+      status: true,
+      is_active: true,
+      role: "admin",
+      phone: "+12025550123", // 🇺🇸 USA
+      createdAt: "2024-01-01",
+      bio: "Senior administrator with full system access",
+      image: "https://i.pravatar.cc/150?img=11",
+    },
+    {
+      id: 2,
+      first_name: "Jane",
+      last_name: "Smith",
+      email: "jane@example.com",
+      status: false,
+      is_active: false,
+      role: "moderator",
+      phone: "+447700900123", // 🇬🇧 UK
+      createdAt: "2024-01-02",
+      bio: "HR moderator with user management permissions",
+      image: "",
+    },
+    {
+      id: 3,
+      first_name: "Bob",
+      last_name: "Johnson",
+      email: "bob@example.com",
+      status: false,
+      is_active: false,
+      role: "editor",
+      phone: "+61412345678", // 🇦🇺 Australia
+      createdAt: "2024-01-03",
+      bio: "Sales team editor with content management access",
+      image: "https://i.pravatar.cc/150?img=3",
+    },
+    {
+      id: 4,
+      first_name: "Alice",
+      last_name: "Williams",
+      email: "alice@example.com",
+      status: false,
+      is_active: false,
+      role: "admin",
+      phone: "+919876543210", // 🇮🇳 India
+      createdAt: "2024-01-04",
+      bio: "Senior administrator with full system access",
+      image: "",
+    },
+    {
+      id: 5,
+      first_name: "Charlie",
+      last_name: "Brown",
+      email: "charlie@example.com",
+      status: false,
+      is_active: false,
+      role: "moderator",
+      phone: "+819012345678", // 🇯🇵 Japan
+      createdAt: "2024-01-05",
+      bio: "HR moderator with user management permissions",
+      image: "https://i.pravatar.cc/150?img=5",
+    },
+    {
+      id: 6,
+      first_name: "Diana",
+      last_name: "Prince",
+      email: "diana@example.com",
+      status: false,
+      is_active: false,
+      role: "viewer",
+      phone: "+4915123456789", // 🇩🇪 Germany
+      createdAt: "2024-01-06",
+      bio: "Sales team viewer with read-only access",
+      image: "",
+    },
+    {
+      id: 7,
+      first_name: "Ethan",
+      last_name: "Hunt",
+      email: "ethan@example.com",
+      status: false,
+      is_active: false,
+      role: "admin",
+      phone: "+33612345678", // 🇫🇷 France
+      createdAt: "2024-01-07",
+      bio: "Senior administrator with full system access",
+      image: "https://i.pravatar.cc/150?img=7",
+    },
+    {
+      id: 8,
+      first_name: "Fiona",
+      last_name: "Green",
+      email: "fiona@example.com",
+      status: true,
+      is_active: true,
+      role: "moderator",
+      phone: "+971501234567", // 🇦🇪 UAE
+      createdAt: "2024-01-08",
+      bio: "HR moderator with user management permissions",
+      image: "",
+    },
+    {
+      id: 9,
+      first_name: "George",
+      last_name: "Miller",
+      email: "george@example.com",
+      status: false,
+      is_active: false,
+      role: "viewer",
+      phone: "+923001234567", // 🇵🇰 Pakistan
+      createdAt: "2024-01-09",
+      bio: "Sales team viewer with read-only access",
+      image: "https://i.pravatar.cc/150?img=9",
+    },
+  ],
+
+  pagination: {
+    current_page: 1,
+    has_next_page: true,
+    has_previous_page: false,
+    records_per_page: 50,
+    total_pages: 6,
+    total_records: 270,
+  },
+};

package/src/index.css

@@ -0,0 +1,170 @@
+@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap");
+
+/* --- Tailwind core layers (must come first) --- */
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+/* --- Primary Color System --- */
+:root {
+  --primary-50: #eff6ff;
+  --primary-100: #dbeafe;
+  --primary-200: #bfdbfe;
+  --primary-300: #93c5fd;
+  --primary-400: #60a5fa;
+  --primary-500: #3b82f6;
+  --primary-600: #2563eb;
+  --primary-700: #1d4ed8;
+  --primary-800: #1e40af;
+  --primary-900: #1e3a8a;
+}
+
+.primary-bg {
+  background-color: var(--primary-500);
+}
+.primary-bg-light {
+  background-color: var(--primary-100);
+}
+.primary-bg-dark {
+  background-color: var(--primary-700);
+}
+.primary-text {
+  color: var(--primary-600);
+}
+.primary-border {
+  border-color: var(--primary-300);
+}
+.primary-hover:hover {
+  background-color: var(--primary-600);
+}
+
+/* --- Custom CSS variables --- */
+:root {
+  --foreground-rgb: 0, 0, 0;
+  --background-start-rgb: 214, 219, 220;
+  --background-end-rgb: 255, 255, 255;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --foreground-rgb: 255, 255, 255;
+    --background-start-rgb: 0, 0, 0;
+    --background-end-rgb: 0, 0, 0;
+  }
+}
+
+/* --- Custom Tailwind base layer --- */
+@layer base {
+  :root {
+    --background: 0 0% 100%;
+    --foreground: 0 0% 3.9%;
+    --card: 0 0% 100%;
+    --card-foreground: 0 0% 3.9%;
+    --popover: 0 0% 100%;
+    --popover-foreground: 0 0% 3.9%;
+    --primary: 0 0% 9%;
+    --primary-foreground: 0 0% 98%;
+    --secondary: 0 0% 96.1%;
+    --secondary-foreground: 0 0% 9%;
+    --muted: 0 0% 96.1%;
+    --muted-foreground: 0 0% 45.1%;
+    --accent: 0 0% 96.1%;
+    --accent-foreground: 0 0% 9%;
+    --destructive: 0 84.2% 60.2%;
+    --destructive-foreground: 0 0% 98%;
+    --border: 0 0% 89.8%;
+    --input: 0 0% 89.8%;
+    --ring: 0 0% 3.9%;
+    --chart-1: 12 76% 61%;
+    --chart-2: 173 58% 39%;
+    --chart-3: 197 37% 24%;
+    --chart-4: 43 74% 66%;
+    --chart-5: 27 87% 67%;
+    --radius: 0.5rem;
+  }
+
+  .dark {
+    --background: 0 0% 3.9%;
+    --foreground: 0 0% 98%;
+    --card: 220 25% 17%;
+    --card-foreground: 0 0% 98%;
+    --popover: 0 0% 3.9%;
+    --popover-foreground: 0 0% 98%;
+    --primary: 0 0% 98%;
+    --primary-foreground: 0 0% 9%;
+    --secondary: 0 0% 14.9%;
+    --secondary-foreground: 0 0% 98%;
+    --muted: 220 21% 23%;
+    --muted-foreground: 0 0% 63.9%;
+    --accent: 0 0% 14.9%;
+    --accent-foreground: 0 0% 98%;
+    --destructive: 0 62.8% 30.6%;
+    --destructive-foreground: 0 0% 98%;
+    --border: 0 0% 14.9%;
+    --input: 0 0% 14.9%;
+    --ring: 0 0% 83.1%;
+    --chart-1: 220 70% 50%;
+    --chart-2: 160 60% 45%;
+    --chart-3: 30 80% 55%;
+    --chart-4: 280 65% 60%;
+    --chart-5: 340 75% 55%;
+  }
+
+  * {
+    @apply border-border;
+  }
+
+  body {
+    @apply bg-background text-foreground;
+  }
+}
+
+/* --- Global styles (safe outside Tailwind layers) --- */
+html,
+body {
+  height: 100%;
+  /* overflow: hidden; */
+}
+
+.bg-login-gradient {
+  @apply min-h-screen bg-gradient-to-br from-purple-50 via-blue-50 to-indigo-100 dark:from-gray-900 dark:to-gray-800;
+}
+
+/* Scrollbar styling */
+:root {
+  --scrollbar-thumb: #d1d5db;
+  --scrollbar-thumb-hover: #9ca3af;
+}
+
+.dark {
+  --scrollbar-thumb: #4b5563;
+  --scrollbar-thumb-hover: #6b7280;
+}
+
+* {
+  scrollbar-width: thin;
+  scrollbar-color: var(--scrollbar-thumb) transparent;
+}
+
+*::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+
+*::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+*::-webkit-scrollbar-thumb {
+  background-color: var(--scrollbar-thumb);
+  border-radius: 3px;
+}
+
+*::-webkit-scrollbar-thumb:hover {
+  background-color: var(--scrollbar-thumb-hover);
+}
+
+.tox.tox-tinymce .tox-edit-area::before {
+  border: 0 !important;
+  box-shadow: none !important;
+}