/*---------------------------------------------------------------
/* Master Reset */
/*html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;outline:0;font-size:100%;vertical-align:baseline;margin:0;padding:0}*/
body{line-height:1}
/*ol,ul{list-style:none}*/
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
:focus{outline:0}
ins{text-decoration:none}
del{text-decoration:line-through}
table{border-collapse:collapse;border-spacing:0}


/* Core */
body { /*color:#525253;*/
    /*font-family: Calibri, Tahoma, Arial,Helvetica,sans-serif !important;*/
    font-family: Roboto, "Open Sans", "Segoe UI", sans-serif, system-ui;
    font-size: 0.9rem !important;
    line-height: 120% !important;
    padding: 5px !important;
    margin: 8px !important;
}

/* Hyperlink */
a,a:active,a:focus{text-decoration:none;}
a:hover{text-decoration:underline;}

/* Headings */
h1,h2,h3,h4,h5,h6{line-height:100%;margin-bottom:5px}
h1 { font-size: 140%; }
h2 { font-size: 120%; }
h3 { font-size: 110%; }
h4 { font-size: 100%; }
h5 { font-size: 100%; }
h6 { font-size: 90%; }
h1{font-size:175%;font-weight:400;line-height:normal;border-bottom:1px dashed #d3d3d3;margin:0 0 10px;padding:0 0 10px}
/*h2{font-family:Georgia,"Times New Roman",Times,serif;font-size:16px;font-weight:400;line-height:110%;margin:0;padding:0 0 4px}*/
p,h1,h2,h3,h4,h5,h6{margin:0.7em 0;padding:0}

/* Clearfix */
.clr{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}
.clearfix:after{clear:both;content:' ';display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}
* html .clearfix,:first-child+html .clearfix{zoom:1}

/* forms */
form{display:inline;padding:0}
input,select,textarea,.inputbox{border-color:#C1C1C1 #E1E1E1 #E1E1E1;border-right:1px solid #E1E1E1;border-style:solid;border-width:1px;color:#656565;font-family:Arial,Helvetica,sans-serif;padding:2px}
hr{background-color:#CCC;border:#CCC;color:#CCC;height:1px}

/* Table */
.adminForm table thead tr,.adminForm table thead tr th{background:#222;color:#fff;text-align:left;border-bottom:1px solid #b4b4b4;font-weight:700;padding:5px 10px}
.adminForm th a{color:#FFF}
.adminForm td {padding:4px; vertical-align:middle;}
td p{line-height:1.3em;margin:0;}
table,.weblinks td{border-collapse:collapse}
.heading{font-weight: bold;text-decoration: underline;}

@media screen and (max-width: 600px) {
.adminForm table
{
    border: 0;
}

.adminForm tr {
    display: block;
    margin-bottom: .625em;
}

.adminForm td {
    display: block;
    text-align: left;
}

}

/* image */
img {
    margin: 0;
    padding: 0
}
.img_caption{padding-right:0}
.img_caption p{color:#999;text-align:center}
/*.img_caption.left,.img_caption.right{}*/

/* ========================================================================= */
/* 🔵 GLOBAL BUTTON STYLING: Applies styles to the class and all standard button types */
/* ========================================================================= */
.button-style,
button[type="submit"],
input[type="submit"],
input[type="button"] {
    /* --- Normalization for cross-browser consistency --- */
    /* Resets the default styling of <button> and <input> to match custom styles */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    box-sizing: border-box; /* Ensures padding and border are included in the element's total width and height */
    /* --- Layout and Structure --- */
    display: inline-block; /* Allows setting padding and margin, and keeps the button on one line */
    padding: 5px 10px;
    border: none; /* Remove default browser border */
    border-radius: 5px; /* Subtle rounded corners */
    cursor: pointer; /* Changes the mouse cursor to a pointer for interactive feedback */
    text-align: center;
    text-decoration: none; /* Important for <a> tags to remove the underline */
    /* --- Typography --- */
    font-family: inherit; /* Inherits the font from the parent element or body */
    font-weight: bold;
    /* --- Define Background and Text Color --- */
    background-color: #007bff; /* Standard Blue */
    color: white; /* High-contrast white text */
    /* --- Visual Depth and Animation Setup --- */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Adds a subtle shadow for a lifted, 3D appearance */
    /* --- Define Animation/Transition --- */
    /* Smoothly animates changes in color, shadow, and position over 0.3 seconds */
    transition: background-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
}

/* ========================================================================= */
/* 🖱️ HOVER/FOCUS ANIMATION: Style changes when the user mouses over or tabs to the button */
/* ========================================================================= */
    .button-style:hover,
    .button-style:focus,
    button[type="submit"]:hover,
    button[type="submit"]:focus,
    input[type="submit"]:hover,
    input[type="submit"]:focus,
    input[type="button"]:hover,
    input[type="button"]:focus {
        /* Color Change */
        background-color: #0056b3; /* Darker blue provides visual feedback */
        /* Lift Effect */
        box-shadow: 0 6px 10px rgba(0, 0, 0, 0.2); /* Deeper shadow when lifted */
        /*transform: translateY(-2px);*/ /* Moves the button up 2 pixels for a lifting effect */
        text-decoration: none; /* Ensures no underline appears on hover/focus for <a> tags */
    }

/* ========================================================================= */
/* 👆 ACTIVE/CLICK EFFECT: Style changes while the user is pressing the button */
/* ========================================================================= */
.button-style:active,
button[type="submit"]:active,
input[type="submit"]:active,
input[type="button"]:active {
    /* Color Change */
    background-color: #004085; /* Even darker blue while pressed */
    /* Press Effect */
    transform: translateY(0); /* Resets the 'lift' and pushes the button down */
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2); /* Smaller shadow to look 'pressed' into the surface */
}

/* ========================================================================= */
/* 🚫 DISABLED STATE: Style for unclickable buttons (Crucial for UX) */
/* ========================================================================= */
.button-style:disabled,
.button-style[disabled],
button:disabled,
button[disabled],
input:disabled,
input[disabled] {
    /* Appearance Change */
    background-color: #cccccc; /* Light grey background */
    color: #666666; /* Darker grey text for low contrast */
    cursor: not-allowed; /* Changes the cursor to indicate non-interactivity */
    /* REMOVE all interactive effects */
    box-shadow: none; /* No shadow */
    transform: none; /* No movement */
    opacity: 0.7; /* Make it slightly transparent to visually denote inactivity */
    /* Prevents the hover/focus state from triggering on certain elements */
    pointer-events: none;
}

/* misc */
small,.small,.smalldark,.article-meta,.modifydate,.img_caption p,a.readmore,#breadcrumbs,.cp,.article-tools,.categories-list dl{font-size:85%;}

/* validation */
.error{font-size:85%;color:red}


/* css for Ajax calandar control. */
.Calendar table tbody tr, .Calendar table thead tr, .Calendar table tbody tr td, .Calendar table thead tr
{
    padding:0;
    margin:0;
    background-color:transparent;
    font-family:Calibri, Tahoma, Arial; 
}

.Calendar .ajax__calendar_container
{
    background-color: white;
    border: solid 1px #cccccc;
}
.Calendar .ajax__calendar_header
{
    background-color: white;
    margin-bottom: 4px;
}
.Calendar .ajax__calendar_title, .Calendar .ajax__calendar_next, .Calendar .ajax__calendar_prev
{
    color: black;
    padding-top: 0;
}
.Calendar .ajax__calendar_body
{
    background-color: transparent;
    border: solid 1px #cccccc;
}
.Calendar .ajax__calendar_dayname
{
    background-color: transparent;
    color: black;
    text-align: center;
    font-weight: bold;
    border:none;
}
.Calendar .ajax__calendar_day
{
    text-align: center;
}

.Calendar .ajax__calendar_hover .ajax__calendar_day, .Calendar .ajax__calendar_hover .ajax__calendar_month, .Calendar .ajax__calendar_hover .ajax__calendar_year, .Calendar .ajax__calendar_active
{
    color: #004080;
    font-weight: bold;
    background-color: silver;
    text-align: center;         
}
.Calendar .ajax__calendar_today
{
    font-weight: bold;
}
.Calendar .ajax__calendar_other
{
    color: #bbbbbb;
}
.Calendar .ajax__calendar_hover .ajax__calendar_today, .Calendar .ajax__calendar_hover .ajax__calendar_title
{
    color: Blue;
}

/* End */

/*.reportViewer input, .reportViewer textarea, .reportViewer table, .reportViewer div {
}*/

.reportViewer td
{
    padding: 0 0 0 0;
    border: 0 none;
}

.rbl input
{
   margin-left: 0;
   margin-right: 2px;
}
.rbl label
{
   margin-left: 2px;
   margin-right: 15px;
}

/* GridView in Store*/
@media screen and (max-width: 600px) {
    /* Hide the table headers */
    .storegridview thead {
        display: none;
    }

    /* Display each row as a block */
    .storegridview tr {
        display: block;
        border: 1px solid #ddd;
        margin-bottom: 10px;
        padding: 10px;
    }

    /* Display table cells as block elements with labels */
    .storegridview td {
        display: block;
        text-align: left;
        padding: 8px;
        position: relative;
    }

    /* Use the HeaderText as a label */
    .storegridview td::before {
        content: attr(data-label);
        font-weight: bold;
        display: block;
        color: #333;
    }
}

/* Standard, Division and Roll number on Default_Nursery page.*/
.responsive-form-row {
    display: flex; /* Enable flex container */
    flex-wrap: wrap; /* Allow items to wrap to the next line */
    gap: 10px; /* Spacing between the items */
    align-items: center; /* Vertically align items */
}

.form-field-group {
    display: flex;
    align-items: center;
    /* Optional: set a minimum width for each group */
    /* min-width: 120px; */
}

/* Spinner */
#loadingOverlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.9);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-family: Arial, sans-serif;
}

.loader {
    border: 6px solid #f3f3f3;
    border-top: 6px solid #0078d4;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
    margin-bottom: 15px;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.loading-text {
    font-size: 16px;
    color: #333;
}