/*
	Template Name: readiprompts
    Template URL: http://demo.themeregion.com/seeker
	Author: readiprompts
	Author URI : http://www.themeregion.com/
    Version: 1.0
    Description: HTML5 Responsive Job Portal Template.
	Tag: HTML5, CSS3, jQuery, Responsive Template.
*/


/* ==========================================================================
 	Extra CSS
 ========================================================================== */
 a, .btn:before, .job-social li a:before,
 .navbar-right span, button.btn-primary,
 .checkbox label:after, .remove-icon,
 .breadcrumb-social span, .job-item .time,
 .job-item .time:after, .button-share,
 .button-share span, .tr-form button,
 .form-control, .category-list .icon img,
 .button-share span i {
       -webkit-transition: all 500ms;
       -moz-transition: all 500ms;
       -ms-transition: all 500ms;
       -o-transition: all 500ms;
       transition: all 500ms;
 }

 /*==========================================================================
      Extra CSS added by me
  ==========================================================================/
 /* Container should take full width *
 .container {
     width: 100%;
     max-width: 100%;
     padding: 0;
     margin: 0;
 }
 /**************************************************************************/


 /* Default styles for larger screens */

li.disabled {
    display: none;
}

@media(min-width: 1024px) {
    #logo {
        width: 160px;
        height: auto;
    }
}

 .container {
     max-width: 1200px;
     margin: 0 auto;
     padding: 15px;
 }

 .form-group select {
     cursor: pointer;
 }

 .prompt-add {
     margin-top: 10px;
 }

 /* Responsive adjustments for tablets */
 @media (max-width: 768px) {
     .container {
         max-width: 100%;
         padding: 10px;
     }
     .form-group {
         width: 100%;
     }
 }

 /* Responsive adjustments for mobile screens */
 @media (max-width: 480px) {
     .container {
         max-width: 100%;
         padding: 5px;
         padding-inline: 15px;
     }

     .form-group {
         width: 100%;
     }

     .btn {
         width: max-content;
         margin-bottom: 10px;
         text-align: center;
         min-width: 150px;
     }
 }

 /* Style for input fields with borders */
 .input-border {
     /* Ensure padding and borders are included in width */
     padding: 10px;
     border-radius: 5px;
     width: 100%;
     box-sizing: border-box;
     /* Gray border */
     border: 2px solid #ccc;
     /* Ensures padding doesn't affect width */
 }

 /* Style for input fields with borders */
 .pulldown-border {
     /* Ensure padding and borders are included in width */
     padding: 10px;
     border-radius: 5px;
     /** width: 100%; **/
     box-sizing: border-box;
     /* Gray border */
     border: 2px solid #ccc;
    border-color: #007bff;
     /* Ensures padding doesn't affect width */
 }



 .input-border:focus {
     border-color: #007bff;
     /* Blue border on focus */
     outline: none;
     box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
 }

 @media(max-width: 767px) {
     .prompt-index {
         border: none;
     }
 }

 .change-text {
     font-size: 14px;
 }
 .dropdown > a {
     background: none !important;
 }

 /************************************* Button Group **********************************/
 .button-group {
     display: flex;
     gap: 10px;
     /* Optional: Adds space between buttons */
 }

 .button-group .form-group {
     margin: 0;
 }

 /***************************************** LIST VIEW *********************************/
 .pagination {
     display: flex;
     padding-left: 0;
     list-style: none;
     border-radius: .25rem;
 }

 .pagination .page-item {
     margin: 0 5px;
 }

 .pagination .page-link {
     position: relative;
     display: block;
     padding: 0.75rem 1.25rem;
     margin-left: -1px;
     line-height: 1.25;
     color: #007bff;
     background-color: #fff;
     border: 1px solid #dee2e6;
     border-radius: .25rem;
     transition: all 0.3s ease;
 }

 .pagination .page-link:hover {
     z-index: 2;
     color: #fff;
     background-color: #28a745;
     border-color: #28a745;
 }

 .pagination .page-link:focus {
     z-index: 2;
     outline: none;
 }

 .pagination .page-item.active .page-link {
     z-index: 1;
     color: #fff;
     background-color: #007bff;
     border-color: #007bff;
 }

 .pagination .page-item.disabled .page-link {
     color: #6c757d;
     pointer-events: none;
     background-color: #fff;
     border-color: #dee2e6;
 }

 /* Add a hover effect for the active page */
 .pagination .page-item.active .page-link:hover {
     background-color: #0056b3;
     border-color: #0056b3;
 }

 .hidden {
     display: none !important;
 }
 /**************************************************************************************/

 /**************************************************************************************/

 /* Responsive Layout */
 .prompt-item {
     padding: 15px;
     border: 1px solid #ccc;
     margin-bottom: 15px;
     display: flex;
     flex-direction: column;
     background: white;
     border-radius: 10px;
 }

 @media (max-width: 768px) {
     .prompt-item {
         padding: 10px;
     }

     h4 {
         font-size: 18px;
     }
 }

 @media (max-width: 576px) {
     h4 {
         font-size: 16px;
     }

     .prompt-item {
         padding: 8px;
     }
 }



 /************************************* STAR RATING **********************************/
 /********************************/
 /*** CSS for rating stars *******/
 /********************************/



 /**************************************************************************************/
 /********************************/
 /*** CSS for rating stars *******/
 /********************************/
 .rating {
     /** font-size: 16px; **/
     color: rgb(119, 116, 116);
     cursor: pointer;
 }

 .star {
     font-size: 20px;
     color: rgb(119, 116, 116);
     cursor: pointer;
 }

 .star.selected, data-selected-rating, .star.hover {
     /** color: rgb(36, 36, 31); **/
     font-size: 20px;
     color: #f90;
 }


 /********************************* DISPLAY ONLY ***************************************/
 .rating-display {
     /** font-size: 16px; **/
     color: rgb(119, 116, 116);
 }

 .star-display {
     font-size: 20px;
     color: rgb(119, 116, 116);
 }

 .rating-selected {
     font-size: 20px;
     color: #f90;
 }

 /****************************** PAGINATION *******************************************/
 /* Pagination Styles */
 .pagination {
     display: flex;
     /* justify-content: left; */
     padding: 5px 0;
     list-style-type: none;
 }

 /** Custom style for the pagination container **/
 .pagination-container {
    display: flex;
    justify-content: center;
    /** 
  border: 1px solid #3498db;  
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  margin-top: 10px;
  background-color: #f9f9f9;
  border-radius: 5px;
  **
    padding: 5px; */
}




/********************* Pagination **************/
/** Custom style for the pagination container **/
.pagination-container {
    display: flex;
    justify-content: center;
    /** 
  border: 1px solid #3498db;  
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  margin-top: 10px;
  background-color: #f9f9f9;
  border-radius: 5px;
  **/
    padding: 5px;
}

.pagination>li>a,
.pagination>li>span {
    color: #3498db;
    border: 3px solid #ddd;
    padding: 5px 10px;
    margin: 5px;
    border-radius: 5px;
}

.pagination>li>a:hover,
.pagination>li>span:hover {
    background-color: #3498db;
    color: #fff;
    border-color: #3498db;
}

.btn {
    padding: 5px 10px;
    margin: 5px;
    border: none;
    background-color: #3498db;
    color: white;
    border-radius: 5px;
    cursor: pointer;
}








 .summary {
     /* border: 1px solid #007bff; */
     /* Blue border around page numbers */
     padding: 5px 5px;
     text-decoration: none;
     color: #007bff;
     font-size: 16px;
     border-radius: 5px;
     /* Rounded corners */
     transition: all 0.3s ease;
 }




 @media (max-width: 768px) {
     .pagination li a {
         padding: 3px 5px;
         /* Adjust padding for smaller screens */
         font-size: 12px;
         /* Smaller font size for responsiveness */
     }
 }

 /************************* VERTICAL LINK ************************************/
 /************************* VERTICAL LINK ************************************/
 /************************* VERTICAL LINK ************************************/
 .vertical-menu {
     width: 280px; /* Default width for larger screens */

     /* Minimal space between menu and content  */
     padding-left: 5px;

     padding-right: 5px;
    /* Reduces space between the menu and content */
 }

 .col-md-9 {
     padding-left: 10px;
     /* Reduces the left padding of the main content */
 }

 .vertical-menu .nav-link {
     display: block;
     padding: 5px;
     background-color: #f1f1f1;
     text-decoration: none;
     color: #333;
     border: 1px solid #007BFF; /* Thicker blue border */
     border-radius: 5px; /* Rounded corners */
 }

 .vertical-menu ul {
     list-style-type: none;
     padding-left: 0;
 }

 .vertical-menu .nav-item {
     margin-bottom: 10px;
 }

 .vertical-menu .nav-link.active {
     background-color: #4CAF50;
     color: white;
     border-color: #0056b3; /* Darker blue for active state */
 }

 .vertical-menu .nav-link:hover {
     background-color: #ddd;
     color: black;
     border-color: #0056b3; /* Darker blue border on hover */
 }

 .row:has(.vertical-menu) {
     flex-wrap: nowrap !important;
 }

 @media(max-width: 1200px) {
     .row:has(.vertical-menu) {
         flex-direction: column !important;
     }

     .vertical-menu {
         width: 100%; /* Adjust to full width on smaller screens */
         overflow-x: scroll;
         padding-top: 5px;
         max-width: 100%;
     }

   .vertical-menu ul {
         display: flex;
         flex-direction: row !important;!i;!;!o;!om;!o;!;
         flex-wrap: nowrap !important;!i;!;
         width: max-content;
         gap: 10px;
         padding-bottom: 10px;
     }

     .vertical-menu + div {
         width: 100%;
         max-width: 100%;
     }

     .input-border h3 {
         font-size: 1.25rem;
         font-weight: 600;
     }

     .input-border h3 strong {
         font-weight: 600;
         color: black;
         display: block;
     }
 }

 /* Media query for smaller devices */
 @media screen and (max-width: 600px) {

 }






 /*********************************************************************************/

 /*********************************************************************************/
 /*********************************************************************************/


 /*********************************************************************************/
 .navbar-nav .nav-item {
     margin-bottom: 5px;
     /* Adds space between the menu items */

     margin-right: 5px;
     /* Adds horizontal space between the menu items */

     margin-left: 5px;
         /* Adds horizontal space between the menu items */

 }

 .navbar-nav .nav-link {
     display: block;
     /** padding: 3px; **/
     padding: 5px 5px;

     /** background-color: #b4c0f1; **/
     background-color: #f0f0f0;

     text-decoration: none;
     color: #333;

     border: 1px solid #007BFF;
     /* Blue border */

     border-radius: 5px;
     /* Rounded corners */

     /* Adjust padding for the menu buttons */
     display: block;
     text-decoration: none;

 }

 .navbar-nav .nav-link.active {
     background-color: #007BFF;
     color: white;
     border-color: #0056b3;
     /* Darker blue for active state */
 }

 .navbar-nav .nav-link:hover {
     background-color: #ddd;
     color: black;
     border-color: #0056b3;
     /* Darker blue on hover */
 }


.centered-div {
    width: 50%;
    /* Set a width */
    margin: 0 auto;
    /* Center horizontally */
    text-align: center;
    /* Centers inline text elements */
}

@media(max-width: 900px) {
    .centered-div {
        width: 100%;
    }
}

.rating + .input-border span.input-border {
    border: none;
    display: flex;
    align-items: center;
    gap: 5px;
}

.rating + .input-border span.input-border a {
    margin: 0;
}
 /******************************************************************************/