sodino/admin/css/admin.css

#sodino-app {
    direction: rtl;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: #0f172a;
}

#sodino-app * {
    box-sizing: border-box;
}

#sodino-app a {
    color: inherit;
    text-decoration: none;
}

#sodino-app .sd-app {
    display: grid;
    gap: 24px;
}

#sodino-app .sd-header {
    background: #eef2ff;
    border: 1px solid #c7d2fe;
    border-radius: 1rem;
    padding: 24px;
}

#sodino-app .sd-header-title {
    font-size: 1.75rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

#sodino-app .sd-header-subtitle {
    color: #475569;
    line-height: 1.75;
}

#sodino-app .sd-page-layout {
    display: grid;
    gap: 24px;
}

@media (min-width: 1024px) {
    #sodino-app .sd-page-layout {
        grid-template-columns: 260px minmax(0, 1fr);
    }
}

#sodino-app .sd-sidebar {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 1rem;
    padding: 18px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

#sodino-app .sd-sidebar-title {
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

#sodino-app .sd-nav {
    display: grid;
    gap: 10px;
}

#sodino-app .sd-nav-link {
    display: block;
    padding: 0.85rem 1rem;
    border-radius: 0.9rem;
    font-weight: 600;
    color: #334155;
    background: #f8fafc;
    border: 1px solid transparent;
    transition: all 0.15s ease-in-out;
    text-align: right;
}

#sodino-app .sd-nav-link:hover,
#sodino-app .sd-nav-link.active {
    background: #e0e7ff;
    border-color: #c7d2fe;
    color: #1e3a8a;
}

#sodino-app .sd-nav-link.disabled {
    color: #94a3b8;
    pointer-events: none;
    background: #f8fafc;
}

#sodino-app .sd-main {
    display: grid;
    gap: 24px;
}

#sodino-app .sd-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 1.25rem;
    padding: 24px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

#sodino-app .sd-stat-grid {
    display: grid;
    gap: 20px;
}

@media (min-width: 1024px) {
    #sodino-app .sd-stat-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

#sodino-app .sd-card-title {
    font-size: 1rem;
    font-weight: 700;
    color: #334155;
    margin-bottom: 1rem;
}

#sodino-app .sd-card-amount {
    font-size: 2rem;
    font-weight: 700;
    color: #0f172a;
}

#sodino-app .sd-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.85rem;
    padding: 0.75rem 1.2rem;
    font-weight: 600;
    transition: all 0.15s ease-in-out;
    border: 1px solid transparent;
    cursor: pointer;
}

#sodino-app .sd-btn-primary {
    background: #4338ca;
    color: #ffffff;
}

#sodino-app .sd-btn-primary:hover {
    background: #3730a3;
}

#sodino-app .sd-btn-secondary {
    background: #f8fafc;
    color: #0f172a;
    border-color: #e2e8f0;
}

#sodino-app .sd-btn-secondary:hover {
    background: #eef2ff;
}

#sodino-app .sd-btn-danger {
    background: #ef4444;
    color: #ffffff;
}

#sodino-app .sd-btn-danger:hover {
    background: #dc2626;
}

#sodino-app .sd-form-group {
    display: grid;
    gap: 12px;
    margin-bottom: 18px;
}

#sodino-app .sd-label {
    font-weight: 700;
    text-align: right;
    color: #0f172a;
}

#sodino-app .sd-input,
#sodino-app .sd-select,
#sodino-app .sd-textarea {
    width: 100%;
    border-radius: 1rem;
    border: 1px solid #cbd5e1;
    padding: 0.85rem 1rem;
    background: #ffffff;
    color: #0f172a;
    outline: none;
}

#sodino-app .sd-input:focus,
#sodino-app .sd-select:focus,
#sodino-app .sd-textarea:focus {
    border-color: #6366f1;
    box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.15);
}

#sodino-app .sd-input[readonly],
#sodino-app .sd-select[disabled] {
    background: #f8fafc;
}

#sodino-app .sd-helper {
    color: #64748b;
    font-size: 0.95rem;
}

#sodino-app .sd-table-wrapper {
    overflow-x: auto;
}

#sodino-app table.sd-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 700px;
}

#sodino-app table.sd-table th,
#sodino-app table.sd-table td {
    padding: 1rem 1.25rem;
    text-align: right;
    border-bottom: 1px solid #e2e8f0;
    vertical-align: middle;
}

#sodino-app table.sd-table thead th {
    background: #f8fafc;
    color: #475569;
    font-weight: 700;
}

#sodino-app table.sd-table tbody tr:nth-child(odd) {
    background: #f8fafc;
}

#sodino-app table.sd-table tbody tr:hover {
    background: #eef2ff;
}

#sodino-app .sd-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.35rem 0.8rem;
    border-radius: 9999px;
    font-size: 0.85rem;
    font-weight: 700;
}

#sodino-app .sd-badge--success {
    background: #dcfce7;
    color: #166534;
}

#sodino-app .sd-badge--danger {
    background: #fee2e2;
    color: #991b1b;
}

#sodino-app .sd-alert {
    border-radius: 1rem;
    padding: 18px 20px;
    margin-bottom: 20px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

#sodino-app .sd-alert-success {
    background: #ecfdf5;
    color: #064e3b;
    border: 1px solid #d1fae5;
}

#sodino-app .sd-alert-error {
    background: #fef2f2;
    color: #7f1d1d;
    border: 1px solid #fecdd3;
}

#sodino-app .sd-grid-3 {
    display: grid;
    gap: 20px;
}

@media (min-width: 768px) {
    #sodino-app .sd-grid-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

#sodino-app .sd-chart-card {
    min-height: 300px;
}

#sodino-app {
    min-height: 100vh;
    background: radial-gradient(circle at top right, rgba(99, 102, 241, 0.14), transparent 22%),
                radial-gradient(circle at bottom left, rgba(59, 130, 246, 0.08), transparent 15%),
                #f8fafc;
    padding: 30px 16px 50px;
    color: #0f172a;
}

#sodino-app .bg-white.rounded-lg.shadow-sm.border,
#sodino-app .bg-white.rounded-2xl.border {
    background: rgba(255, 255, 255, 0.98);
    border-color: rgba(148, 163, 184, 0.70);
    box-shadow: 0 18px 35px rgba(15, 23, 42, 0.10);
}

#sodino-app .bg-white.rounded-lg.shadow-sm.border,
#sodino-app .bg-white.rounded-2xl.border,
#sodino-app .bg-gray-50,
#sodino-app .sd-sidebar,
#sodino-app .sd-card,
#sodino-app .sd-chart-card {
    border-width: 1px;
    border-style: solid;
}

#sodino-app .bg-gray-50 {
    background: #f7fbff !important;
    border-color: rgba(148, 163, 184, 0.35);
}

#sodino-app .shadow-sm {
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.09) !important;
}

#sodino-app .sd-sidebar,
#sodino-app .sd-card,
#sodino-app .sd-chart-card {
    border-color: rgba(148, 163, 184, 0.65);
}

#sodino-app .rounded-lg,
#sodino-app .rounded-2xl,
#sodino-app .rounded-md {
    border-radius: 1.3rem !important;
}

#sodino-app .space-y-2 > a {
    display: block;
    padding: 0.95rem 1rem;
    border-radius: 1rem;
    transition: all 0.18s ease-in-out;
    border: 1px solid transparent;
}

#sodino-app .space-y-2 > a:hover {
    background: rgba(99, 102, 241, 0.1);
}

#sodino-app .text-gray-500,
#sodino-app .text-gray-600,
#sodino-app .text-gray-700 {
    color: #334155 !important;
}

#sodino-app h1,
#sodino-app h2,
#sodino-app h3,
#sodino-app h4 {
    letter-spacing: -0.02em;
}

#sodino-app .bg-white.rounded-lg.shadow-sm.border p,
#sodino-app .bg-white.rounded-2xl.border p {
    color: #475569;
}

#sodino-app .bg-white.rounded-lg.shadow-sm.border .inline-flex,
#sodino-app .bg-white.rounded-2xl.border .inline-flex {
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06);
}

#sodino-app table thead th {
    color: #334155 !important;
}

#sodino-app .wp-list-table .column-name,
#sodino-app .wp-list-table .column-title {
    font-weight: 600;
}

#sodino-app .sodino-form-notice {
    border-radius: 8px;
    margin-bottom: 20px;
    padding: 16px 18px;
    border: 1px solid;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
}

#sodino-app .sodino-form-notice strong {
    display: block;
    margin-bottom: 6px;
    font-size: 0.95rem;
}

#sodino-app .sodino-form-notice p {
    margin: 0;
    font-size: 0.92rem;
}

#sodino-app .sodino-form-notice-error {
    background: #fff1f2;
    border-color: #fecdd3;
    color: #9f1239;
}

#sodino-app .sodino-form-notice-success {
    background: #ecfdf3;
    border-color: #bbf7d0;
    color: #166534;
}

/* Local utility layer for the Sodino admin. This replaces the previous Tailwind CDN dependency. */
#sodino-app {
    min-height: 100vh;
    padding: 28px 18px 48px;
    background: #f4f7fb;
    color: #172033;
    font-family: Tahoma, Arial, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

#sodino-app *,
#sodino-app *::before,
#sodino-app *::after {
    box-sizing: border-box;
}

#sodino-app h1,
#sodino-app h2,
#sodino-app h3,
#sodino-app h4,
#sodino-app p {
    margin-top: 0;
    letter-spacing: 0;
}

#sodino-app a {
    text-decoration: none;
}

#sodino-app input,
#sodino-app select,
#sodino-app textarea,
#sodino-app button {
    font: inherit;
}

#sodino-app .min-h-screen { min-height: 100vh; }
#sodino-app .max-w-7xl { max-width: 1280px; }
#sodino-app .mx-auto { margin-left: auto; margin-right: auto; }
#sodino-app .min-w-0 { min-width: 0; }
#sodino-app .min-w-full { min-width: 100%; }
#sodino-app .w-full { width: 100%; }
#sodino-app .w-64 { width: 16rem; }
#sodino-app .w-4 { width: 1rem; }
#sodino-app .w-5 { width: 1.25rem; }
#sodino-app .h-4 { height: 1rem; }
#sodino-app .h-5 { height: 1.25rem; }
#sodino-app .h-64 { height: 16rem; }
#sodino-app .h-full { height: 100%; }
#sodino-app .block { display: block; }
#sodino-app .hidden { display: none; }
#sodino-app .inline-flex { display: inline-flex; }
#sodino-app .flex { display: flex; }
#sodino-app .grid { display: grid; }
#sodino-app .flex-1 { flex: 1 1 0%; }
#sodino-app .flex-col { flex-direction: column; }
#sodino-app .flex-shrink-0 { flex-shrink: 0; }
#sodino-app .items-center { align-items: center; }
#sodino-app .justify-between { justify-content: space-between; }
#sodino-app .justify-center { justify-content: center; }
#sodino-app .justify-end { justify-content: flex-end; }
#sodino-app .gap-2 { gap: 0.5rem; }
#sodino-app .gap-3 { gap: 0.75rem; }
#sodino-app .gap-4 { gap: 1rem; }
#sodino-app .gap-6 { gap: 1.5rem; }
#sodino-app .gap-8 { gap: 2rem; }
#sodino-app .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
#sodino-app .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#sodino-app .relative { position: relative; }
#sodino-app .absolute { position: absolute; }
#sodino-app .z-10 { z-index: 10; }
#sodino-app .overflow-hidden { overflow: hidden; }
#sodino-app .overflow-x-auto { overflow-x: auto; }
#sodino-app .cursor-pointer { cursor: pointer; }

#sodino-app .p-4 { padding: 1rem; }
#sodino-app .p-5 { padding: 1.25rem; }
#sodino-app .p-6 { padding: 1.5rem; }
#sodino-app .px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
#sodino-app .px-4 { padding-left: 1rem; padding-right: 1rem; }
#sodino-app .px-5 { padding-left: 1.25rem; padding-right: 1.25rem; }
#sodino-app .px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
#sodino-app .py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
#sodino-app .py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
#sodino-app .py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
#sodino-app .py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
#sodino-app .py-8 { padding-top: 2rem; padding-bottom: 2rem; }
#sodino-app .pb-6 { padding-bottom: 1.5rem; }
#sodino-app .pt-6 { padding-top: 1.5rem; }
#sodino-app .mt-1 { margin-top: 0.25rem; }
#sodino-app .mt-2 { margin-top: 0.5rem; }
#sodino-app .mt-8 { margin-top: 2rem; }
#sodino-app .mb-2 { margin-bottom: 0.5rem; }
#sodino-app .mb-4 { margin-bottom: 1rem; }
#sodino-app .mb-6 { margin-bottom: 1.5rem; }
#sodino-app .mb-8 { margin-bottom: 2rem; }
#sodino-app .mr-2 { margin-right: 0.5rem; }
#sodino-app .-ml-1 { margin-left: -0.25rem; }
#sodino-app .space-y-2 > * + * { margin-top: 0.5rem; }
#sodino-app .space-y-3 > * + * { margin-top: 0.75rem; }
#sodino-app .space-y-4 > * + * { margin-top: 1rem; }
#sodino-app .space-y-6 > * + * { margin-top: 1.5rem; }
#sodino-app .space-y-8 > * + * { margin-top: 2rem; }

#sodino-app .rounded { border-radius: 4px; }
#sodino-app .rounded-md,
#sodino-app .rounded-lg,
#sodino-app .rounded-xl,
#sodino-app .rounded-2xl,
#sodino-app .sd-sidebar,
#sodino-app .sd-card,
#sodino-app .sd-chart-card {
    border-radius: 8px !important;
}
#sodino-app .rounded-full { border-radius: 9999px; }

#sodino-app .border { border: 1px solid #d8e0ea; }
#sodino-app .border-b { border-bottom: 1px solid #d8e0ea; }
#sodino-app .border-t { border-top: 1px solid #d8e0ea; }
#sodino-app .border-r-2 { border-right: 2px solid currentColor; }
#sodino-app .border-transparent { border-color: transparent; }
#sodino-app .border-gray-200 { border-color: #d8e0ea; }
#sodino-app .border-gray-300 { border-color: #c7d2df; }
#sodino-app .border-blue-700 { border-color: #1769aa; }
#sodino-app .divide-y > * + * { border-top: 1px solid #d8e0ea; }
#sodino-app .divide-gray-200 > * + * { border-color: #d8e0ea; }

#sodino-app .bg-white {
    background: #ffffff;
}
#sodino-app .bg-gray-50 {
    background: #f6f8fb !important;
}
#sodino-app .bg-gray-100 {
    background: #eef3f8;
}
#sodino-app .bg-gray-300 {
    background: #c7d2df;
}
#sodino-app .bg-blue-50 {
    background: #e8f3fb;
}
#sodino-app .bg-blue-600,
#sodino-app .from-blue-600 {
    background: #1769aa;
}
#sodino-app .to-blue-700 {
    background: #115487;
}
#sodino-app .bg-gradient-to-br {
    background: linear-gradient(135deg, #1769aa, #115487);
}
#sodino-app .bg-green-50 {
    background: #e9f8ef;
}
#sodino-app .bg-yellow-50 {
    background: #fff7df;
}

#sodino-app .text-xs { font-size: 0.75rem; line-height: 1rem; }
#sodino-app .text-sm { font-size: 0.875rem; line-height: 1.5; }
#sodino-app .text-lg { font-size: 1.125rem; line-height: 1.6; }
#sodino-app .text-xl { font-size: 1.25rem; line-height: 1.5; }
#sodino-app .text-2xl { font-size: 1.5rem; line-height: 1.35; }
#sodino-app .text-3xl { font-size: 1.875rem; line-height: 1.25; }
#sodino-app .font-medium { font-weight: 500; }
#sodino-app .font-semibold { font-weight: 600; }
#sodino-app .font-bold { font-weight: 700; }
#sodino-app .text-right { text-align: right; }
#sodino-app .text-white { color: #ffffff; }
#sodino-app .text-gray-500 { color: #64748b !important; }
#sodino-app .text-gray-600 { color: #475569 !important; }
#sodino-app .text-gray-700 { color: #334155 !important; }
#sodino-app .text-gray-900 { color: #172033 !important; }
#sodino-app .text-blue-600 { color: #1769aa; }
#sodino-app .text-blue-700 { color: #115487; }
#sodino-app .text-green-600 { color: #198754; }
#sodino-app .text-green-700 { color: #146c43; }
#sodino-app .text-red-500 { color: #dc3545; }
#sodino-app .text-red-600 { color: #c82333; }
#sodino-app .text-yellow-700 { color: #946200; }
#sodino-app .opacity-90 { opacity: 0.9; }

#sodino-app .shadow-sm,
#sodino-app .shadow-lg,
#sodino-app .bg-white.rounded-lg.shadow-sm.border,
#sodino-app .bg-white.rounded-2xl.border {
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06) !important;
}

#sodino-app .transition-colors {
    transition-property: color, background-color, border-color, box-shadow, transform;
}
#sodino-app .duration-200 {
    transition-duration: 160ms;
}
#sodino-app .hover\:bg-gray-50:hover {
    background: #eef3f8;
}
#sodino-app .hover\:bg-blue-700:hover {
    background: #115487;
}
#sodino-app .hover\:text-gray-900:hover {
    color: #172033;
}
#sodino-app .hover\:border-blue-300:hover {
    border-color: #7db8df;
}
#sodino-app .focus\:outline-none:focus {
    outline: none;
}
#sodino-app .focus\:border-blue-500:focus {
    border-color: #2488d1;
}
#sodino-app .focus\:ring-2:focus {
    box-shadow: 0 0 0 3px rgba(36, 136, 209, 0.18);
}
#sodino-app .focus\:ring-blue-100:focus,
#sodino-app .focus\:ring-blue-500:focus {
    box-shadow: 0 0 0 3px rgba(36, 136, 209, 0.18);
}
#sodino-app .focus\:ring-offset-2:focus {
    outline-offset: 2px;
}

#sodino-app .bg-white.border-b.border-gray-200 {
    border: 1px solid #d8e0ea;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
}

#sodino-app aside .bg-white,
#sodino-app main > .bg-white,
#sodino-app .grid > .bg-white,
#sodino-app .bg-white.rounded-lg.shadow-sm.border,
#sodino-app .bg-white.rounded-2xl.border {
    border: 1px solid #d8e0ea;
    border-radius: 8px !important;
    background: #ffffff;
}

#sodino-app aside {
    position: sticky;
    top: 42px;
    align-self: flex-start;
}

#sodino-app nav.space-y-2 a {
    border: 1px solid transparent;
    border-radius: 8px !important;
    padding: 0.7rem 0.85rem;
}

#sodino-app nav.space-y-2 a.bg-blue-50,
#sodino-app nav.space-y-2 a:hover {
    background: #e8f3fb;
    color: #115487 !important;
    border-color: #b9d9ee;
}

#sodino-app input[type="text"],
#sodino-app input[type="number"],
#sodino-app input[type="url"],
#sodino-app input[type="datetime-local"],
#sodino-app input[type="date"],
#sodino-app select,
#sodino-app textarea {
    min-height: 42px;
    border-radius: 8px !important;
    border: 1px solid #c7d2df !important;
    background: #ffffff;
    color: #172033;
    box-shadow: none;
}

#sodino-app input[type="checkbox"] {
    border-radius: 4px;
    border-color: #9fb0c1;
}

#sodino-app button,
#sodino-app .inline-flex[href],
#sodino-app input[type="submit"] {
    border-radius: 8px !important;
}

#sodino-app canvas {
    display: block;
}

#sodino-app .wp-list-table {
    border: 1px solid #d8e0ea;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
}

#sodino-app .wp-list-table thead th {
    background: #eef3f8;
    color: #334155 !important;
    font-weight: 700;
}

#sodino-app .wp-list-table tbody tr:hover {
    background: #f6f8fb;
}

@media (min-width: 640px) {
    #sodino-app .sm\:px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
    #sodino-app .sm\:flex-row { flex-direction: row; }
    #sodino-app .sm\:items-center { align-items: center; }
    #sodino-app .sm\:justify-between { justify-content: space-between; }
}

@media (min-width: 768px) {
    #sodino-app .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #sodino-app .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    #sodino-app .md\:col-span-2 { grid-column: span 2 / span 2; }
}

@media (min-width: 1024px) {
    #sodino-app .lg\:px-8 { padding-left: 2rem; padding-right: 2rem; }
    #sodino-app .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #sodino-app .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    #sodino-app .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    #sodino-app .lg\:grid-cols-\[280px_1fr\] { grid-template-columns: 280px minmax(0, 1fr); }
    #sodino-app .lg\:col-span-2 { grid-column: span 2 / span 2; }
    #sodino-app .lg\:flex-row { flex-direction: row; }
    #sodino-app .lg\:items-center { align-items: center; }
    #sodino-app .lg\:justify-between { justify-content: space-between; }
}

@media (max-width: 960px) {
    #sodino-app {
        padding: 18px 10px 36px;
    }

    #sodino-app > .max-w-7xl > .flex,
    #sodino-app .max-w-7xl > .flex {
        flex-direction: column;
    }

    #sodino-app aside,
    #sodino-app .w-64 {
        width: 100%;
        position: static;
    }
}