/* Custom Breakpoints for Bica Child Theme */
/* Mobile: 0px to 991px */
/* Tablet: 992px to 1199px */
/* Desktop: 1200px and above */

/* Base mobile styles (0px to 991px) */
.col, .columns, .gallery-item {
    margin: 0;
    padding: 0 15px 30px;
    position: relative;
    width: 100%;
}

/* Small grid classes (mobile) - apply to all sizes by default */
.small-1 { flex-basis: 8.3333333333%; max-width: 8.3333333333%; }
.small-2 { flex-basis: 16.6666666667%; max-width: 16.6666666667%; }
.small-3 { flex-basis: 25%; max-width: 25%; }
.small-4 { flex-basis: 33.3333333333%; max-width: 33.3333333333%; }
.small-5 { flex-basis: 41.6666666667%; max-width: 41.6666666667%; }
.small-6 { flex-basis: 50%; max-width: 50%; }
.small-7 { flex-basis: 58.3333333333%; max-width: 58.3333333333%; }
.small-8 { flex-basis: 66.6666666667%; max-width: 66.6666666667%; }
.small-9 { flex-basis: 75%; max-width: 75%; }
.small-10 { flex-basis: 83.3333333333%; max-width: 83.3333333333%; }
.small-11 { flex-basis: 91.6666666667%; max-width: 91.6666666667%; }
.small-12 { flex-basis: 100%; max-width: 100%; }

/* Tablet breakpoint: 992px to 1199px */
@media screen and (min-width: 992px) and (max-width: 1199px) {
    /* Medium grid classes for tablet */
    .medium-1 { flex-basis: 8.3333333333%; max-width: 8.3333333333%; }
    .medium-2 { flex-basis: 16.6666666667%; max-width: 16.6666666667%; }
    .medium-3 { flex-basis: 25%; max-width: 25%; }
    .medium-4 { flex-basis: 33.3333333333%; max-width: 33.3333333333%; }
    .medium-5 { flex-basis: 41.6666666667%; max-width: 41.6666666667%; }
    .medium-6 { flex-basis: 50%; max-width: 50%; }
    .medium-7 { flex-basis: 58.3333333333%; max-width: 58.3333333333%; }
    .medium-8 { flex-basis: 66.6666666667%; max-width: 66.6666666667%; }
    .medium-9 { flex-basis: 75%; max-width: 75%; }
    .medium-10 { flex-basis: 83.3333333333%; max-width: 83.3333333333%; }
    .medium-11 { flex-basis: 91.6666666667%; max-width: 91.6666666667%; }
    .medium-12 { flex-basis: 100%; max-width: 100%; }

    .medium-col-first { order: -1; }
    .col { padding-bottom: 30px; }
}

/* Desktop breakpoint: 1200px and above */
@media screen and (min-width: 1200px) {
    /* Large grid classes for desktop */
    .large-1 { flex-basis: 8.3333333333%; max-width: 8.3333333333%; }
    .large-2 { flex-basis: 16.6666666667%; max-width: 16.6666666667%; }
    .large-3 { flex-basis: 25%; max-width: 25%; }
    .large-4 { flex-basis: 33.3333333333%; max-width: 33.3333333333%; }
    .large-5 { flex-basis: 41.6666666667%; max-width: 41.6666666667%; }
    .large-6 { flex-basis: 50%; max-width: 50%; }
    .large-7 { flex-basis: 58.3333333333%; max-width: 58.3333333333%; }
    .large-8 { flex-basis: 66.6666666667%; max-width: 66.6666666667%; }
    .large-9 { flex-basis: 75%; max-width: 75%; }
    .large-10 { flex-basis: 83.3333333333%; max-width: 83.3333333333%; }
    .large-11 { flex-basis: 91.6666666667%; max-width: 91.6666666667%; }
    .large-12 { flex-basis: 100%; max-width: 100%; }

    .large-col-first { order: -1; }

    .col:first-child .col-inner {
        margin-left: auto;
        margin-right: 0;
    }

    .col + .col .col-inner {
        margin-left: 0;
        margin-right: auto;
    }

    .row-divided > .col + .col:not(.large-12) {
        border-left: 1px solid #ececec;
    }

    .row-divided.row-reverse > .col + .col:not(.large-12) {
        border-left: 0;
        border-right: 1px solid #ececec;
    }

    .col-divided {
        border-right: 1px solid #ececec;
        padding-right: 30px;
    }

    .col.col-divided:not(.col-first):last-child {
        border-left: 1px solid #ececec;
        border-right: 0;
        padding-left: 30px;
        padding-right: 0;
    }

    .col-border {
        border-right: 1px solid #ececec;
        padding-right: 0;
    }

    .col-border + .col,
    .col-divided + .col {
        padding-left: 30px;
    }
}

/* Mobile specific styles: up to 991px */
@media screen and (max-width: 991px) {
    .small-col-first { order: -1; }

    /* Hide desktop-only elements on mobile */
    .hide-for-small { display: none !important; }

    /* Mobile navigation adjustments */
    .mobile-sidebar { display: block; }

    /* Mobile text alignment */
    .text-center-mobile { text-align: center !important; }
    .text-left-mobile { text-align: left !important; }
    .text-right-mobile { text-align: right !important; }
}

/* Tablet specific styles: 992px to 1199px */
@media screen and (min-width: 992px) and (max-width: 1199px) {
    .hide-for-medium { display: none !important; }

    /* Tablet text alignment */
    .text-center-medium { text-align: center !important; }
    .text-left-medium { text-align: left !important; }
    .text-right-medium { text-align: right !important; }
}

/* Desktop specific styles: 1200px and above */
@media screen and (min-width: 1200px) {
    .hide-for-large { display: none !important; }
    .show-for-large { display: block !important; }

    /* Desktop text alignment */
    .text-center-large { text-align: center !important; }
    .text-left-large { text-align: left !important; }
    .text-right-large { text-align: right !important; }
}