.divider:after,
.divider:before {
content: "";
flex: 1;
height: 1px;
background: #eee;
}
.h-custom {
height: calc(100% - 73px);
}
@media (max-width: 450px) {
.h-custom {
height: 100%;
}
}

#devicesTable th {
    text-align: center !important;
    vertical-align: middle !important;
}

#devicesTable th:nth-child(1),  /* View column */
#devicesTable th:nth-child(2) { /* Image column */
    pointer-events: none;
    cursor: default;
}

#preview img {
    vertical-align: middle;
    display: inline-block;
    margin: 5px;
}

.dashboard_nav-link {
    color: #0D6EFD !important;
}

td {
  text-align: center;
  vertical-align: middle;
}

/* Left-align the text within the table cells */
.table td {
  text-align: center;
}

/* Left-align the text within the strong tags for better emphasis */
.table td strong {
  text-align: center;
  display: inline-block;
}

.small-tooltip .tooltip-inner {
        font-size: 12px; /* Adjust the font size as needed */
}

.tile {
  background-color: #337ab7;
  color: white;
  padding: 20px;
  padding-bottom: 20px;
  border: 1px solid #ccc;
  height: 200px;
  width:200px;

    /* Set the bottom 20% of the div to have a blue background */


}

.device_label {
    height:30px;
    width:200px;
    text-align: center;
    background-color: #232C64;
    color: white;
    font-size: larger;
}

#filter-form {


}

#smart-home-surveillance-cameras {
  background-image: url('../images/images-devices/smart-home-camera.jpeg');
  background-size: cover;

}

#smart-entertainment-devices {
  background-image: url('../images/images-devices/entertainment_devices.jpeg');
  background-size: cover;
}

#smart-home-utilities {
  background-image: url('../images/images-devices/smart_home_utilities.png');
  background-size: cover;

}

#smart-remote-control{
  background-image: url('../images/images-devices/smart_remote_control.jpeg');
  background-size: cover;
}

/* New Row */
#smart-childrens_toys {
  background-image: url('../images/images-devices/smart_childrens_toys.jpeg');
  background-size: cover;

}

#smart-wearables {
  background-image: url('../images/images-devices/smart-wearables.jpeg');
  background-size: cover;
}

#smart-health-pet-devices {
  background-image: url('../images/images-devices/smart_pet_devices.jpeg');
  background-size: cover;

}

#smart-home-appliances{
  background-image: url('../images/images-devices/smart_home_appliances.webp');
  background-size: cover;
}

/*New Row */
#smart-childrens_toys {
  background-image: url('../images/images-devices/smart_childrens_toys.jpeg');
  background-size: cover;

}

#smart-wearables {
  background-image: url('../images/images-devices/smart-wearables.jpeg');
  background-size: cover;
}

#smart-health-pet-devices {
  background-image: url('../images/images-devices/smart_pet_devices.jpeg');
  background-size: cover;

}

#smart-home-appliances{
  background-image: url('../images/images-devices/smart_home_appliances.webp');
  background-size: cover;
}

/*New Row */
#smart-garage-doors {
  background-image: url('../images/images-devices/smart_garage_door.png');
  background-size: cover;

}

#smart-vehicle-systems {
  background-image: url('../images/images-devices/smart_vehicle_systems.jpeg');
  background-size: cover;
}

#smart-pool-monitoring-systems {
  background-image: url('../images/images-devices/smart_pool_monitoring_systems.webp');
  background-size: cover;

}

#smart-bluetooth-gps-devices{
  background-image: url('../images/images-devices/bluetooth_gps.jpeg');
  background-size: cover;
}

#smart-fishtank-devices{
  background-image: url('../images/images-devices/smart_fish_tank.webp');
  background-size: cover;
}

#smart-lighting-devices{
  background-image: url('../images/images-devices/smart_lighting_solutions.jpeg');
  background-size: cover;
}

#smart-blinds-devices{
  background-image: url('../images/images-devices/smart_blinds.webp');
  background-size: cover;
}

#smart-doorlock-devices{
  background-image: url('../images/images-devices/smart_door_lock.webp');
  background-size: cover;
}

#smart-home_security-devices{
  background-image: url('../images/images-devices/smart_home_security_systems.jpeg');
  background-size: cover;
}


nav {
font-size: 25px;
}

/* Set a style for the submit/login button */
.form-container .btn {
  background-color: #04AA6D;
  color: white;
  padding: 16px 20px;
  border: black;
  cursor: pointer;
  width: 100%;
  margin-bottom:10px;
  opacity: 0.8;
}

.btn-primary {
  width: 300px;
  height: 60px;
  text-align: center;
}



.navbar-nav .nav-link.active, .navbar-nav .show>.nav-link {
    color: #0098cf;
}


.navbar  .navbar-nav .nav-link:hover {
    color: #0098cf;
}

.navbar-brand:hover {
    color: rgb(245 5 5 / 90%);

}


.search {
    color: white;
}

/*registration form*/
@media (min-width: 1025px) {
.h-custom {
height: 100vh !important;
}
}
.card-registration .select-input.form-control[readonly]:not([disabled]) {
font-size: 1rem;
line-height: 2.15;
padding-left: .75em;
padding-right: .75em;
}
.card-registration .select-arrow {
top: 13px;
}

.gradient-custom-2 {
/* fallback for old browsers */
background: #a1c4fd;

/* Chrome 10-25, Safari 5.1-6 */
background: -webkit-linear-gradient(to right, rgba(161, 196, 253, 1), rgba(194, 233, 251, 1));

/* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
background: linear-gradient(to right, rgba(161, 196, 253, 1), rgba(194, 233, 251, 1))
}

.bg-indigo {
background-color: #4835d4;
}
@media (min-width: 992px) {
.card-registration-2 .bg-indigo {
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;
}
}
@media (max-width: 991px) {
.card-registration-2 .bg-indigo {
border-bottom-left-radius: 15px;
border-bottom-right-radius: 15px;
}
}

table.table td a.edit {
    color: #FFC107;
}
table.table td a.delete {
    color: #E34724;
}
table.table td i {
    font-size: 19px;
}

.table th {
  text-align: center;
  vertical-align: middle;
}

.search-table{
    padding: 10%;
    margin-top: -6%;
}
.search-box{
    background: #232c64;
    border: 1px solid #ababab;
    padding: 3%;
}
.search-box input:focus{
    box-shadow:none;
    border:2px solid #eeeeee;
}
.search-list{
    background: #fff;
    border: 1px solid #ababab;
    border-top: none;
}
.search-list h3{
    background: #eee;
    padding: 3%;color:#fe6f41;
    margin-bottom: 0%;
}


.input-text{
    margin:30px 0;
     display:flex;
    gap:20px;
}

.input-text .input-div{
    width:100%;
    position:relative;

}

.navbar-brand {
    color: white;
}

.nav-link  {
    color: white;
}

/* ======== HOME PAGE RESPONSIVE DESIGN ======== */
/* Main Container */
#landing-container {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: stretch; /* Ensures both sections have equal height */
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 20px;
    box-sizing: border-box;
    min-height: 500px; /* Ensures a reasonable default height */
}

/* Left Section - Image */
#left-section {
    flex: 1.3;
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 55%;
}

#left-section img {
    width: 100%;
    max-width: 550px;
    height: 100%; /* Ensures the image fills the height */
    max-height: 100%;
    object-fit: contain; /* Keeps aspect ratio without cropping */
    border-radius: 10px;
}

/* Right Section - Text */
#right-section {
    flex: 1;
    padding: 20px;
    text-align: left;
    max-width: 600px;
    display: flex;
    flex-direction: column;
    justify-content: center; /* Centers text inside */
}

/* Links container */
#links-container {
    margin-top: 20px;
}

#links-container a {
    display: inline-block;
    padding: 10px 15px;
    text-decoration: none;
    color: #ffffff;
    background-color: #007BFF;
    border-radius: 5px;
    transition: background-color 0.3s ease-in-out;
}

#links-container a:hover {
    background-color: #0056b3;
}

/* ============ RESPONSIVE DESIGN FOR HOME PAGE ============ */
@media (max-width: 1024px) {
    #landing-container {
        max-width: 100%;
        padding: 15px;
    }
    
    #left-section {
        min-width: 50%;
    }
    
    #left-section img {
        max-width: 450px;
    }

    #right-section {
        max-width: 500px;
    }
}

/* Mobile View: Image at the top, Text at the bottom */
@media (max-width: 768px) {
    #landing-container {
        flex-direction: column-reverse; /* Places text below the image */
        text-align: center;
        align-items: center;
    }

    #left-section, #right-section {
        flex: none;
        width: 100%;
        max-width: none;
    }

    #left-section {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 15px; /* Adds spacing between image and text */
    }

    #left-section img {
        max-width: 350px;
        height: auto;
    }

    #right-section {
        padding: 10px;
    }

    #links-container a {
        display: block;
        margin: 10px 0;
    }
}

@media (max-width: 450px) {
    #left-section img {
        max-width: 300px;
    }
}