/**
 * SMM Today Plugin - Vibrant Gradient UI (Complete & Final Version)
 * Version: 7.0
 * Description: The final, complete, and scoped stylesheet incorporating all user
 * feedback: vibrant gradient background, off-white content area, natural-sized
 * elements, and styled filter/search controls.
 */

/* ==========================================================================
   1. Base & Gradient Background
   ========================================================================== */
   @import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700&display=swap');

   /* Scoping: Apply gradient and font ONLY to the plugin's body tag */
.toplevel_page_smm-today-menu .wrap,
[class*="smm-today_page_"] .wrap {
    text-align: center;
}

.toplevel_page_smm-today-menu .wrap h1,
[class*="smm-today_page_"] .wrap h1 {
    font-weight: 700;
    padding: 20px;
    font-size: 55px; 
    line-height: 1.2;
    background-image: linear-gradient(to right, #ff3d3d, #8a2be2, #1e90ff);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent; 
    background-size: 300% 100%; 
    animation: gradient-shift 4s ease infinite alternate; 
}

.toplevel_page_smm-today-menu .wrap p,
[class*="smm-today_page_"] .wrap p {
    color: #333333; 
    font-size: 15px; 
    font-weight: bold;
}

.toplevel_page_smm-today-menu .wrap h2,
[class*="smm-today_page_"] .wrap h2 {
    font-weight: 700;
    padding: 20px;
    font-size: 20px; 
    line-height: 1.2;
    background-image: linear-gradient(to right, #077716, #065366, #8d0f58);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent; 
    background-size: 300% 100%; 
    animation: gradient-shift 4s ease infinite alternate; 
}

@keyframes gradient-shift {
    0% { background-position: 0% 50%; }
    100% { background-position: 100% 50%; }
}


    


   /* ==========================================================================
      2. Forms & Inputs (Standardized Size)
      ========================================================================== */
   .toplevel_page_smm-today-menu .smm-form-container,
   [class*="smm-today_page_"] .smm-form-container {
       text-align: left;
   }


   .toplevel_page_smm-today-menu label,
   [class*="smm-today_page_"] label {
       color: #000000;
       font-weight: 600;
       margin-bottom: 8px;
       display: block;
   }
   
   .toplevel_page_smm-today-menu input[type="text"],
   .toplevel_page_smm-today-menu input[type="email"],
   .toplevel_page_smm-today-menu input[type="url"],
   .toplevel_page_smm-today-menu input[type="number"],
   .toplevel_page_smm-today-menu input[type="search"], /* Added search input */
   .toplevel_page_smm-today-menu textarea,
   .toplevel_page_smm-today-menu select,
   [class*="smm-today_page_"] input[type="text"],
   [class*="smm-today_page_"] input[type="email"],
   [class*="smm-today_page_"] input[type="url"],
   [class*="smm-today_page_"] input[type="number"],
   [class*="smm-today_page_"] input[type="search"], /* Added search input */
   [class*="smm-today_page_"] textarea,
   [class*="smm-today_page_"] select {
       width: 100%;
       padding: 8px 10px; /* Natural size for all fields */
       font-size: 14px;
       border: 1px solid #ddd;
       border-radius: 6px;
       background-color: #fdfdfd;
       color: #000000;
       transition: all 0.3s ease;
       margin: 0; /* Reset margin for fields inside forms */
   }
   
   .toplevel_page_smm-today-menu input:focus,
   .toplevel_page_smm-today-menu textarea:focus,
   .toplevel_page_smm-today-menu select:focus,
   [class*="smm-today_page_"] input:focus,
   [class*="smm-today_page_"] textarea:focus,
   [class*="smm-today_page_"] select:focus {
       border-color: #8b5cf6;
       box-shadow: 0 0 0 1px #8b5cf6;
       outline: none;
   }
   
   /* ==========================================================================
      3. Buttons (Standardized Size)
      ========================================================================== */
      .toplevel_page_smm-today-menu .button,
      [class*="smm-today_page_"] .button {
          font-weight: 600;
          border-radius: 6px;
          padding: 6px 14px; /* Natural size for all buttons */
          font-size: 13px;
          border: none !important; 
          transition: none !important;
          box-shadow: none !important;
          opacity: 1 !important;
      }
      
      .toplevel_page_smm-today-menu .button-primary,
      [class*="smm-today_page_"] .button-primary {
          background: linear-gradient(90deg, #8b5cf6, #3b82f6) !important; 
          color: #ffffff;

      }

      .toplevel_page_smm-today-menu .button-secondary,
      [class*="smm-today_page_"] .button-secondary {
        background: linear-gradient(45deg, #e74c3c, #be2d3c) !important; 
        color: #ffffff !important;
      }
   
   /* ==========================================================================
      4. Tables
      ========================================================================== */
      .toplevel_page_smm-today-menu .wp-list-table,
      [class*="smm-today_page_"] .wp-list-table {
          text-align: left;
          border: 1px solid #f0f0f0;
          border-radius: 12px;
          overflow: hidden;
      }

      .toplevel_page_smm-today-menu .wp-list-table thead th,
      [class*="smm-today_page_"] .wp-list-table thead th {
          background-color: #fdfdfd;
          color: #000000;
          font-weight: 700;
      }
      
      .toplevel_page_smm-today-menu .wp-list-table tbody tr:hover,
      [class*="smm-today_page_"] .wp-list-table tbody tr:hover {
          background-color: #f0f9ff;
      }
      
      .toplevel_page_smm-today-menu .wp-list-table td,
      [class*="smm-today_page_"] .wp-list-table td {
          border-bottom: 1px solid #f0f0f0;
          color: #333;
          vertical-align: middle;
      }
      
      .toplevel_page_smm-today-menu .wp-list-table td a,
      [class*="smm-today_page_"] .wp-list-table td a {
          color: #3b82f6;
          font-weight: 600;
      }

 

   /* ==========================================================================
      6. Connection Status
      ========================================================================== */






 /* ===============================================
 * -7  Support Page 
 * =============================================== */

/* Main container for the support page */
.smmtoday-support-page-v5 {
    max-width: 1200px;
    margin: 40px auto;
    padding: 0;
    background: transparent;
    box-shadow: none;
    text-align: left;
    font-family: 'Cairo', sans-serif;
}

/* Header Section with Logo */
.smmtoday-main-header-v5 {
    text-align: center;
    padding: 30px 20px;
    margin-bottom: 30px;
}

.smmtoday-logo-image-v5 {
    max-width: 280px;
    height: auto;
    margin-bottom: 20px;
}

.smmtoday-main-header-v5 h1 {
    font-size: 2.2em;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 8px 0;
    border: none;
    padding: 0;
}

.smmtoday-main-header-v5 .smmtoday-subtitle-v5 {
    font-size: 1.1em;
    color: #4b5563;
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.6;
}

/* Section Title */
.smmtoday-section-title-v5 {
    text-align: center;
    font-size: 1.8em;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 30px;
    border-bottom: 2px solid #ddd;
    padding-bottom: 15px;
}

/* Grid layout for feature cards */
.smmtoday-features-grid-v5 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 25px;
    margin-bottom: 40px;
}

/* Feature Card style - NO HOVER MOVEMENT */
.smmtoday-feature-card-v5 {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.06);
    border: 1px solid #e5e7eb;
    overflow: hidden;
}

.smmtoday-card-header-v5 {
    display: flex;
    align-items: center;
    padding: 18px 22px;
    background-color: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
}

.smmtoday-card-header-v5 .dashicons {
    color: #4f46e5;
    font-size: 20px;
    margin-right: 12px;
}

.smmtoday-card-header-v5 h3 {
    margin: 0;
    font-size: 1.2em;
    font-weight: 600;
    color: #111827;
}

.smmtoday-card-body-v5 {
    padding: 22px;
}

.smmtoday-card-body-v5 p {
    font-size: 15px;
    line-height: 1.65; /* Reduced line height */
    color: #374151;
    margin: 0 0 12px 0; /* Reduced margin between paragraphs */
}

.smmtoday-card-body-v5 p:last-child {
    margin-bottom: 0;
}

.smmtoday-card-body-v5 strong {
    color: #1f2937;
}

/* Contact & Developer Info Section */
.smmtoday-contact-section-v5 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
    padding: 30px;
    background: #f9fafb;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
}

.smmtoday-developer-info-v5 {
    text-align: left;
}
.smmtoday-developer-info-v5 h3 {
    margin: 0 0 10px 0;
    font-size: 1.3em;
}
.smmtoday-developer-info-v5 p {
    margin: 0 0 5px 0;
    color: #374151;
}
.smmtoday-developer-info-v5 p a {
    color: #4f46e5;
    font-weight: 600;
    text-decoration: none;
}
.smmtoday-developer-info-v5 p a:hover {
    text-decoration: underline;
}

.smmtoday-contact-buttons-v5 {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}
.smmtoday-contact-button-v5 {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 25px;
    border-radius: 8px;
    font-size: 1em;
    font-weight: 600;
    text-decoration: none;
    border: none;
    transition: opacity 0.2s ease; /* Static hover effect */
}
.smmtoday-contact-button-v5:hover {
    opacity: 0.9; /* Subtle hover effect without movement */
}
.smmtoday-contact-button-v5 .dashicons {
    font-size: 20px;
}
.smmtoday-contact-button-v5.whatsapp {
    background: #139c45; color: #fff;
}
.smmtoday-contact-button-v5.website {
    background: #374151; color: #fff;
}
 










.smmtoday-table th, .smmtoday-table td {
    text-align: center;
    vertical-align: middle;
}
/* Control width for each column */
.smmtoday-table th:nth-child(1), .smmtoday-table td:nth-child(1) { text-align: left; width: 15%; }
.smmtoday-table th:nth-child(2), .smmtoday-table td:nth-child(2) { text-align: left; width: 25%; }
.smmtoday-table th:nth-child(3), .smmtoday-table td:nth-child(3) { width: 10%; }
.smmtoday-table th:nth-child(4), .smmtoday-table td:nth-child(4) { width: 10%; }
.smmtoday-table th:nth-child(5), .smmtoday-table td:nth-child(5) { width: 10%; }
.smmtoday-table th:nth-child(6), .smmtoday-table td:nth-child(6) { width: 10%; }
.smmtoday-table th:nth-child(7), .smmtoday-table td:nth-child(7) { width: 20%; }

#smm-adjust-balance-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 9999;
    display: none; /* Changed from flex to none by default */
    justify-content: center;
    align-items: center;
}
.smm-modal-content {
    background: white;
    padding: 20px;
    border-radius: 5px;
    width: 450px;
    max-width: 90%;
}
.notice-warning a.button {
    vertical-align: middle;
}
#balance_amount, #balance_type {
    width: 100% !important;
    box-sizing: border-box;
}

















/**
 * SMM Today - SAAS Style Admin Header CSS
 * Version: 8.0 (30/70 Layout Split)
 */

/* --- المتغيرات الرئيسية للألوان --- */
:root {
    --smm-grad-start: #176d8f;
    --smm-grad-end: #35a2b5;
    --smm-nav-bg-hover: rgba(0, 0, 0, 0.1);
    --smm-nav-bg-active: rgba(0, 0, 0, 0.2);
    --smm-text-color: #ffffff;
    --smm-version-glow-color: #ffc107; 
  }
  
 
  /* --- تنسيق الحاوية الرئيسية للهيدر (مع التقسيم الجديد) --- */
  .smmtoday-admin-header-saas {
    max-width: 1200px !important; /* تحديد أقصى عرض وإجباره */
    margin-left: auto !important;   /* توسيط إجباري من اليسار */
    margin-right: auto !important;  /* توسيط إجباري من اليمين */
    float: none !important; 
    display: flex;
    align-items: center;
    gap: 20px; 
    background: linear-gradient(to right, var(--smm-grad-start), var(--smm-grad-end));
    color: var(--smm-text-color);
    padding: 15px 25px;
    margin: 20px;
    border-radius: 12px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.25);
  }
  
  /* --- تعديل قسم البراند (الصورة فوق الإصدار) --- */
  .smmtoday-header-brand {
    display: flex;
    flex-direction: column; 
    align-items: center; 
    gap: 10px;
    flex: 0 0 20%; 
  }
  
  .smmtoday-header-brand img {
    max-height: 40px; /* تكبير بسيط للصورة */
  }
  
  .smmtoday-plugin-version {
    background-color: var(--smm-version-glow-color);
    color: #1d2327;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 0 12px 0px var(--smm-version-glow-color);
    transition: all 0.2s ease-in-out;
    cursor: pointer;
  }
 
  /* --- تعديل قائمة التنقل لتأخذ باقي المساحة --- */
  .smmtoday-main-nav {
    flex-grow: 1; 
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 6px;
  }

  .smmtoday-main-nav .nav-item {
    margin-left: 10px;
}
  
  .smmtoday-main-nav .nav-item {
    display: flex;
    flex-direction: row; 
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: bold;
    font-size: 16px;
    gap: 15px;
    padding: 10px 15px;
    color: var(--smm-text-color);
    text-decoration: none;
    border-radius: 8px;
    transition: all 0.2s ease-in-out;
  }
  
  .smmtoday-main-nav .nav-item:hover {
    background-color: var(--smm-nav-bg-hover);
    transform: translateY(-2px);
  }
  
  .smmtoday-main-nav .nav-item.active {
    background-color: var(--smm-nav-bg-active);
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.2);
    transform: translateY(0);
  }
  

  .smmtoday-header-actions {
    min-width: 150px;
    text-align: right;
  }



 

/*
 * ==========================================================================
 * SMM Today - Admin Notice Position Fix (FINAL & FORCED)
 * ==========================================================================
 * This code forces WordPress notices to stay at the top of the page,
 * preventing any JavaScript from moving them into the plugin content.
 */
/* ===== Responsive Tables for Mobile & Tablet ===== */
@media (max-width: 768px) {
    /* Hide table headers */
    .toplevel_page_smm-today-menu .wp-list-table thead,
    [class*="smm-today_page_"] .wp-list-table thead {
        display: none;
    }

    /* Make each row a block (card) */
    .toplevel_page_smm-today-menu .wp-list-table tbody tr,
    [class*="smm-today_page_"] .wp-list-table tbody tr {
        display: block;
        margin-bottom: 15px;
        padding: 15px;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    }

    /* Make each cell a flex row with label */
    .toplevel_page_smm-today-menu .wp-list-table tbody td,
    [class*="smm-today_page_"] .wp-list-table tbody td {
        display: flex;
        justify-content: space-between;
        width: 100%;
        padding: 8px 0;
        border: none;
    }

    /* Add labels before each cell */
    .toplevel_page_smm-today-menu .wp-list-table tbody td:nth-child(1)::before,
    [class*="smm-today_page_"] .wp-list-table tbody td:nth-child(1)::before {  font-weight: 600; color: #4a5568; }
    .toplevel_page_smm-today-menu .wp-list-table tbody td:nth-child(2)::before,
    [class*="smm-today_page_"] .wp-list-table tbody td:nth-child(2)::before { font-weight: 600; color: #4a5568; }
    .toplevel_page_smm-today-menu .wp-list-table tbody td:nth-child(3)::before,
    [class*="smm-today_page_"] .wp-list-table tbody td:nth-child(3)::before {  font-weight: 600; color: #4a5568; }
    .toplevel_page_smm-today-menu .wp-list-table tbody td:nth-child(4)::before,
    [class*="smm-today_page_"] .wp-list-table tbody td:nth-child(4)::before {  font-weight: 600; color: #4a5568; }

    /* Labels styling */
    .toplevel_page_smm-today-menu .wp-list-table tbody td::before,
    [class*="smm-today_page_"] .wp-list-table tbody td::before {
        display: block;
        margin-bottom: 5px;
        font-size: 12px;
    }

    /* Adjust links */
    .toplevel_page_smm-today-menu .wp-list-table td a,
    [class*="smm-today_page_"] .wp-list-table td a {
        font-size: 14px;
        word-break: break-word;
    }
}








/* ===== Responsive Header for Tablet & Mobile ===== */
@media (max-width: 1024px) {
    .smmtoday-admin-header-saas {
        flex-direction: column;
        align-items: stretch;
        padding: 15px;
        gap: 15px;
        max-width: 95% !important;
        margin: 15px auto !important;
    }

    .smmtoday-header-brand {
        flex: 0 0 auto;
        align-items: center;
        justify-content: center;
        gap: 8px;
    }

    .smmtoday-main-nav {
        grid-template-columns: repeat(3, 1fr);
        gap: 5px;
    }

    .smmtoday-main-nav .nav-item {
        font-size: 14px;
        padding: 8px 10px;
        gap: 8px;
    }

    .smmtoday-header-actions {
        text-align: center;
        min-width: auto;
    }
}

@media (max-width: 768px) {
    .smmtoday-admin-header-saas {
        flex-direction: column;
        gap: 12px;
        padding: 10px;
    }

    .smmtoday-header-brand img {
        max-height: 35px;
    }

    .smmtoday-main-nav {
        grid-template-columns: repeat(2, 1fr);
        gap: 4px;
    }

    .smmtoday-main-nav .nav-item {
        font-size: 13px;
        padding: 6px 8px;
        gap: 6px;
    }

    .smmtoday-plugin-version {
        font-size: 11px;
        padding: 4px 10px;
    }

    .smmtoday-header-actions {
        text-align: center;
    }
}

@media (max-width: 480px) {
    .smmtoday-main-nav {
        grid-template-columns: 1fr;
    }

    .smmtoday-main-nav .nav-item {
        font-size: 12px;
        padding: 5px;
    }

    .smmtoday-header-brand img {
        max-height: 30px;
    }

    .smmtoday-plugin-version {
        font-size: 10px;
        padding: 3px 8px;
    }
}


/* ===== Responsive Headings for Mobile & Tablet ===== */
@media (max-width: 1024px) {
    .toplevel_page_smm-today-menu .wrap h1,
    [class*="smm-today_page_"] .wrap h1 {
        font-size: 40px;
        padding: 15px;
        line-height: 1.2;
    }

    .toplevel_page_smm-today-menu .wrap h2,
    [class*="smm-today_page_"] .wrap h2 {
        font-size: 18px;
        padding: 15px;
    }
}

@media (max-width: 768px) {
    .toplevel_page_smm-today-menu .wrap h1,
    [class*="smm-today_page_"] .wrap h1 {
        font-size: 30px;
        padding: 10px;
    }

    .toplevel_page_smm-today-menu .wrap h2,
    [class*="smm-today_page_"] .wrap h2 {
        font-size: 16px;
        padding: 10px;
    }

    .toplevel_page_smm-today-menu .wrap p,
    [class*="smm-today_page_"] .wrap p {
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .toplevel_page_smm-today-menu .wrap h1,
    [class*="smm-today_page_"] .wrap h1 {
        font-size: 24px;
        padding: 8px;
    }

    .toplevel_page_smm-today-menu .wrap h2,
    [class*="smm-today_page_"] .wrap h2 {
        font-size: 14px;
        padding: 8px;
    }

    .toplevel_page_smm-today-menu .wrap p,
    [class*="smm-today_page_"] .wrap p {
        font-size: 13px;
    }
}