/* =====================================================
   DARK MODE
===================================================== */

.dark body {
    background: linear-gradient(
        to bottom right,
        #020617,
        #0f172a,
        #111827
    ) !important;

    color: #e2e8f0;
}

/* Scrollbar */
.dark ::-webkit-scrollbar-track {
    background: #0f172a;
}

.dark ::-webkit-scrollbar-thumb {
    background: #475569;
}

.dark ::-webkit-scrollbar-thumb:hover {
    background: #64748b;
}

/* Glass Navigation */
.dark .glass-nav {
    background: rgba(15, 23, 42, 0.92);
    backdrop-filter: blur(12px);
    border-color: #334155;
}

/* Modal */
.dark .modal-overlay {
    background: rgba(0, 0, 0, 0.75);
}

/* Gradient Text */
.dark .gradient-text {
    background: linear-gradient(
        135deg,
        #60a5fa 0%,
        #a78bfa 100%
    );

    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Stock Card */
.dark .stock-card {
    background: #0f172a;
    border-color: #334155;
    color: #e2e8f0;
}

.dark .stock-card:hover {
    box-shadow: 0 12px 24px -8px rgba(0, 0, 0, 0.5);
}

.dark .stock-card.favorited {
    background: linear-gradient(
        135deg,
        #0f172a 0%,
        #334155 100%
    );

    border-color: #fbbf24;
}

/* Sector Card */
.dark .sector-card {
    background: #0f172a;
    border-color: #334155;
    color: #e2e8f0;
}

.dark .sector-card:hover {
    background: #273549;

    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.4);
}

/* Favorite Button */
.dark .favorite-btn {
    color: #facc15;
}

/* Profile Dropdown */
.dark .profile-dropdown {
    background: #0f172a;
    border: 1px solid #334155;
}

/* Success */
.dark .bg-success {
    background: #059669 !important;
}

/* ATM Label */
.dark .atm-label {
    background: #0f172a;
    /*color: #cbd5e1;*/
}

/* Strike Row */
.dark .strike-row:hover {
    background-color: #0f172a;
}

/* Subscription */
.dark .subscription-panel {
    background: #0f172a;
    color: #e2e8f0;
}

.dark .subscription-overlay {
    background: rgba(2, 6, 23, 0.85);
}

/* Plan Card */
.dark .plan-card {
    background: #0f172a;
    border-color: #334155;
    color: #e2e8f0;
}

.dark .plan-card:hover {
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.45);
}

.dark .plan-card.selected {
    border-color: #60a5fa;

    background: linear-gradient(
        135deg,
        #1e3a8a 0%,
        #1e40af 100%
    );

    box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.2);
}

/* Chart */
.dark .chart-container {
    background: transparent;
}

.dark .atm-line {
    border-top-color: #64748b;
}

/* History */
.dark .history-row:hover {
    background-color: #0f172a;
}

/* Feedback */
.dark .feedback-category {
    background: #0f172a;
    border-color: #334155;
    color: #e2e8f0;
}

.dark .feedback-category:hover {
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.4);
}

.dark .feedback-category.selected {
    border-color: #60a5fa;

    background: linear-gradient(
        135deg,
        #1e3a8a 0%,
        #2563eb 100%
    );

    box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.2);
}

/* Inputs */
.dark input,
.dark textarea,
.dark select {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}

.dark input::placeholder,
.dark textarea::placeholder {
    color: #94a3b8;
}

/* Tables */
.dark table {
    background: #0f172a;
    color: #e2e8f0;
}

.dark tr {
    border-color: #334155;
}

/* Generic Tailwind Overrides */
.dark .bg-white {
    background-color: #0f172a !important;
}

.dark .bg-gray-50,
.dark .bg-slate-50 {
    background-color: #0f172a !important;
}

.dark .text-black,
.dark .text-gray-900,
.dark .text-slate-900,
.dark .text-slate-800 {
    color: #f8fafc !important;
}

.dark .text-gray-500,
.dark .text-gray-600,
.dark .text-slate-500,
.dark .text-slate-600 {
    /*color: #cbd5e1 !important;*/
}

.dark .border,
.dark .border-gray-200,
.dark .border-slate-200 {
    border-color: #334155 !important;
}

/* Hover Utilities */
.dark .hover\:bg-gray-50:hover {
    background-color: #0f172a !important;
}

.dark .hover\:bg-slate-50:hover {
    background-color: #0f172a !important;
}

.dark .text-slate-700{
    color: #ffffff;
}
.dark .bg-transparent{
    background-color: transparent;
}

/*---- POSITIVE TREND ---------*/
.dark .green-trend.bg-gradient-to-r.to-white.from-green-50{
    background: #121727 !important;
    border: 1px solid green;
}

.dark .blue-trend.bg-gradient-to-r.to-white.from-blue-50{
    background: #121727 !important;
    border: 1px solid blue;
}

.dark .bg-green-100.text-green-700, .dark .bg-blue-100.text-blue-700, .dark .bg-lightblue-100.text-lightblue-600{
    background: #121727 !important;
    color: #ffffff;
} 

.dark .bg-red-100.text-red-700, .dark .bg-yellow-100.text-yellow-700, .dark .bg-lightblue-100.text-lightblue-600{
    background: #121727 !important;
    color: #ffffff;
} 

/*---- NEGETIVE TREND ---------*/
.dark .red-trend.bg-gradient-to-r.to-white.from-red-50{
    background: #121727 !important;
    border: 1px solid red;
}

.dark .yellow-trend.bg-gradient-to-r.to-white.from-yellow-50{
    background: #121727 !important;
    border: 1px solid yellow;
}

.dark .lightblue-trend.bg-gradient-to-r.to-white.from-lightblue-50{
    background: #121727 !important;
    border: 1px solid lightblue;
}

/*---- Sector ----------------*/
.dark .bg-gradient-to-r.to-white.from-green-50, .dark .bg-gradient-to-r.to-white.from-yellow-50, .dark .bg-gradient-to-r.to-white.from-blue-50, .dark .bg-gradient-to-r.to-white.from-red-50 {
    /*background: #121727 !important;*/
    background: #2c3242 !important;
}

.dark .green-trend.bg-gradient-to-r.to-white.from1-green-50.border-1.border-green-200{
    background: #121727 !important;
}

.dark .blue-trend.bg-gradient-to-r.to-white.from1-blue-50.border-1.border-blue-200{
    background: #121727 !important;
}

.dark .red-trend.bg-gradient-to-r.to-white.from1-red-50.border-1.border-red-200{
    background: #121727 !important;
}

.dark .yellow-trend.bg-gradient-to-r.to-white.from1-yellow-50.border-1.border-yellow-200{
    background: #121727 !important;
}

.dark .lightblue-trend.bg-gradient-to-r.to-white.from1-lightblue-50.border-1.border-lightblue-200{
    background: #121727 !important;
}

.dark .bg-green-100, .dark .bg-red-100{
    background: #000000 !important;
}

.dark .bg-red-50{
    background: #000000 !important;
}

.dark .text-slate-600{
   color: #ffffff; 
}

/*.dark .text-slate-600, .dark .text-slate-900{
    background: #121727 !important;
}*/

.dark .bg-gradient-to-br.from-blue-50.to-indigo-50.border.border-blue-100{
    background: #121727 !important;
}

/*.dark .bg-gradient-to-r.to-white.from-red-50{
    background: #121727 !important;
}*/

/*--- Settting -- */
.dark .text-gray-800, .dark .text-gray-700{
    color: #ffffff; 
}

/*--- Profile -----*/
.dark .bg-gradient-to-r.from-blue-600.via-indigo-600.to-purple-600, .dark .bg-gradient-to-r.from-slate-50.to-white.p-6.border-b.border-slate-200{
    background: #121727 !important;
} 

.dark .bg-gradient-to-br.from-purple-50.to-indigo-50.border.border-purple-100{
    background: #121727 !important;
    color: #ffffff;
}

.dark .text-purple-700{
    color: #ffffff;
}
.dark .pillbg-grayDark{
    background: transparent;
    border: 1px solid #333d52;
}
.dark .pillbg-grayDark .text-gray-600{
    color: #adadad;
}
.dark .hover\:bg-slate-100:hover{
    background-color: #343f55;
}

.dark .bg-gradient-to-r.to-white{
    background: #3b475c;
}

.dark .text-purple-900, .dark .text-purple-600{
    color:#ac4fff;
}

/* ---- Feedback ----*/
.dark .text-red-900, .dark .text-red-700{
    color: #d8161b;
}

.dark .text-purple-700{
    color: #8838e8;
}

.dark .bg-gradient-to-br.from-orange-50.to-red-50 {
    background: #3b475c;
}

.dark .text-orange-900, .dark .text-orange-900{
    color: #e65815;
}

.dark .bg-blue-50.border-r.border-slate-200{
    background: #3b475c;
}

.dark .bg-slate-100, .dark .bg-yellow-50{
    background: #3b475c;
}

.dark .text-slate-500{
    color: #fff;
}

.dark .bg-gradient-to-r.to-white{
 background: #3b475c;
}

.dark .sector .lightblue-trend, .dark .sector .lightblue-trend[data-v-2389878f]{
    border-top: none !important;
    border-bottom: none !important;
    border-right: none !important;
}