/* ========================================================== qrcafeh — modern.css طبقة تنسيق "جوال أولاً" تُحمَّل بعد style.css. المبادئ: قياسات سائلة بـ clamp()، شبكة auto-fill، aspect-ratio للصور، مساحات آمنة (safe-area)، وحركة تحترم تفضيلات المستخدم. لإلغائها بالكامل: احذف رابط هذا الملف من includes/header.php. ========================================================== */ :root{--wrap-pad: clamp(12px,3.2vw,28px);--gap: clamp(10px,1.6vw,18px);--card-min: clamp(150px,42vw,215px);--r-card: clamp(14px,1.8vw,20px);--r-ctl: 12px;--nav-h: 62px;--safe-b: env(safe-area-inset-bottom,0px);--ring: 0 0 0 3px rgba(255,107,53,.22);--shadow-card: 0 1px 2px rgba(16,24,40,.06),0 4px 14px rgba(16,24,40,.06)}html{-webkit-text-size-adjust: 100%;text-size-adjust: 100%}body{-webkit-tap-highlight-color: transparent;text-rendering: optimizeLegibility;overflow-x: hidden}a,button,select,input,.place-card,.type-btn,.nav-item{touch-action: manipulation}button{font-family: inherit}.main-content .container,.top-header .container{padding-inline: var(--wrap-pad)}.main-content{min-height: 0;padding-top: clamp(12px,2.4vw,28px);padding-bottom: calc(var(--nav-h) + var(--safe-b) + 28px)}.top-header{padding: 8px 0;background: rgba(255,255,255,.92);-webkit-backdrop-filter: saturate(1.4) blur(10px);backdrop-filter: saturate(1.4) blur(10px)}.header-content{gap: 10px}.logo-text{font-size: clamp(1.15rem,4.6vw,1.5rem)}@media (max-width: 768px){.menu-toggle{width: 40px;height: 40px}}.banners-slider{margin-bottom: clamp(14px,2.4vw,28px);border-radius: var(--r-card);box-shadow: var(--shadow-card)}.slider-container{height: auto;aspect-ratio: 16 / 6;min-height: 130px;max-height: 420px}.slide img{width: 100%;height: 100%;object-fit: cover}@media (max-width: 560px){.slider-container{aspect-ratio: 16 / 8}.slider-btn{width: 32px;height: 32px}}.banner-cards{display: grid;grid-template-columns: repeat(auto-fit,minmax(clamp(140px,42vw,280px),1fr));gap: var(--gap);margin-bottom: clamp(14px,2.4vw,28px)}.banner-card{border-radius: var(--r-card);overflow: hidden;box-shadow: var(--shadow-card)}.banner-card img{width: 100%;height: auto;aspect-ratio: 16 / 9;object-fit: cover}.filters-section{padding: clamp(12px,2.4vw,24px);margin-bottom: clamp(14px,2.4vw,28px);border-radius: var(--r-card);box-shadow: var(--shadow-card)}.section-title{font-size: clamp(1.05rem,3.4vw,1.6rem);margin-bottom: clamp(8px,1.6vw,16px)}.filters-container{gap: clamp(8px,1.6vw,16px)}.location-filters{display: grid;grid-template-columns: repeat(auto-fit,minmax(min(100%,150px),1fr));gap: clamp(6px,1.2vw,12px)}.filter-select{width: 100%;min-width: 0;min-height: 42px;padding: 8px 10px;font-size: clamp(.8rem,3.2vw,1rem);border-width: 1px;border-radius: var(--r-ctl);text-overflow: ellipsis}.filter-select:focus{box-shadow: var(--ring)}.type-filter{flex-wrap: nowrap;overflow-x: auto;gap: 8px;padding-block: 2px;scroll-snap-type: x proximity;-webkit-overflow-scrolling: touch;scrollbar-width: none;margin-inline: calc(var(--wrap-pad) * -1);padding-inline: var(--wrap-pad)}.type-filter::-webkit-scrollbar{display: none}.type-btn{flex: 0 0 auto;scroll-snap-align: start;min-height: 38px;padding: 6px 14px;font-size: clamp(.8rem,3.2vw,.95rem);gap: 6px;border-width: 1px;border-radius: 999px;white-space: nowrap}@media (min-width: 900px){.type-filter{flex-wrap: wrap;overflow: visible;margin-inline: 0;padding-inline: 0}}.filters-section .action-buttons{gap: 8px}.btn-near-me,.btn-reset{flex: 1 1 0;justify-content: center;min-height: 42px;padding: 8px 14px;font-size: clamp(.8rem,3.2vw,.95rem);gap: 6px;border-width: 1px;border-radius: var(--r-ctl)}@media (min-width: 700px){.btn-near-me,.btn-reset{flex: 0 0 auto;padding-inline: 22px}}.results-header{display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;gap: 8px;margin-bottom: 12px}.results-header .section-title{margin: 0}.per-page-selector{font-size: .8rem;gap: 6px}.per-page-selector select{padding: 4px 6px;border-radius: 8px}@media (max-width: 480px){.per-page-selector>span{display: none}}.places-grid{display: grid;grid-template-columns: repeat(auto-fill,minmax(var(--card-min),1fr));gap: var(--gap)}.place-card{display: flex;flex-direction: column;border-radius: var(--r-card);box-shadow: var(--shadow-card);overflow: hidden;contain: content;-webkit-user-select: none;user-select: none}.place-card:hover{transform: none;box-shadow: var(--shadow-card)}@media (hover: hover) and (pointer: fine){.place-card{transition: transform .18s ease,box-shadow .18s ease}.place-card:hover{transform: translateY(-4px);box-shadow: 0 10px 28px rgba(16,24,40,.14)}}.place-card:active{transform: scale(.985)}.card-image{height: auto;aspect-ratio: 4 / 3}.card-image img{width: 100%;height: 100%;object-fit: cover}.placeholder-logo{font-size: clamp(2rem,9vw,3.4rem)}.favorite-btn{top: 8px;right: 8px;width: 34px;height: 34px;font-size: 1rem;box-shadow: 0 2px 8px rgba(0,0,0,.15)}.rtl .favorite-btn{right: auto;left: 8px}.card-content{flex: 1 1 auto;display: flex;flex-direction: column;gap: 4px;padding: clamp(8px,2.4vw,16px)}.card-title{font-size: clamp(.9rem,3.6vw,1.1rem);line-height: 1.35;margin: 0}.card-type{margin: 0;font-size: clamp(.72rem,3vw,.85rem)}.card-description{margin: 0;font-size: clamp(.72rem,3vw,.85rem);line-height: 1.5}.card-distance{margin: 0;font-size: .78rem}.card-actions{display: grid;grid-auto-flow: column;grid-auto-columns: minmax(0,1fr);gap: 6px;padding: 8px clamp(8px,2.4vw,16px) clamp(8px,2.4vw,14px);border-top: 0}.card-actions .action-btn{height: 38px;padding: 0;margin: 0;min-width: 0;max-width: none;display: flex;align-items: center;justify-content: center;gap: 6px;border: 0;border-radius: 10px;color: #fff;font-size: 1.1rem;line-height: 1;box-shadow: none}.card-actions .action-btn i{font-size: 1em;line-height: 1;color: inherit}.card-actions .action-btn.whatsapp{background: #25D366}.card-actions .action-btn.maps{background: #4285F4}.card-actions .action-btn.menu,.card-actions .action-btn.menu.with-text{background: var(--primary-color);order: 0}.card-actions .action-btn.with-text span{display: none;font-size: .8rem;font-weight: 700;white-space: nowrap}@media (min-width: 640px){.card-actions .action-btn.with-text span{display: inline}}.card-actions .action-btn:active{filter: brightness(.92);transform: scale(.97)}@media (max-width: 640px){.places-grid{grid-template-columns: repeat(3,minmax(0,1fr));gap: 6px}.place-card{border-radius: 12px}.card-image{aspect-ratio: 1 / 1}.favorite-btn{top: 4px;right: 4px;width: 26px;height: 26px;font-size: .75rem}.rtl .favorite-btn{right: auto;left: 4px}.card-content{padding: 6px 6px 2px;gap: 2px}.card-title{font-size: .78rem;line-height: 1.3}.card-type{font-size: .66rem;gap: 3px}.card-description{font-size: .64rem;line-height: 1.4;-webkit-line-clamp: 1;line-clamp: 1}.card-distance{font-size: .64rem}.card-actions{gap: 3px;padding: 4px 6px 6px}.card-actions .action-btn{height: 28px;font-size: .85rem;border-radius: 7px}}@media (max-width: 360px){.places-grid{gap: 4px}.card-title{font-size: .72rem}.card-actions .action-btn{height: 26px;font-size: .8rem}}.pagination-container{margin-top: clamp(16px,3vw,32px);gap: 12px}.pagination{flex-wrap: wrap;justify-content: center;gap: 6px}.page-btn{min-width: 38px;height: 38px}@media (max-width: 480px){.go-to-page{display: none}}.bottom-nav{padding: 4px 0 var(--safe-b);min-height: calc(var(--nav-h) + var(--safe-b));background: rgba(255,255,255,.94);-webkit-backdrop-filter: saturate(1.4) blur(12px);backdrop-filter: saturate(1.4) blur(12px);box-shadow: 0 -1px 0 rgba(16,24,40,.08),0 -6px 20px rgba(16,24,40,.06)}.nav-item{padding: 4px;font-size: .7rem;gap: 2px;min-height: 48px;justify-content: center}.nav-item i{font-size: 1.2rem}.nav-item-center{margin-top: -26px}.add-button{width: 54px;height: 54px;font-size: 1.35rem}@media (min-width: 900px){.bottom-nav{max-width: 520px;margin-inline: auto;border-radius: 18px 18px 0 0}}@media (max-width: 640px){#placeModal .modal-content{width: 100%;max-width: none;max-height: 92dvh;margin: 0;position: fixed;inset: auto 0 0 0;border-radius: 20px 20px 0 0;padding-bottom: calc(var(--spacing-lg) + var(--safe-b));overflow-y: auto;overscroll-behavior: contain}}@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration: .01ms !important;animation-iteration-count: 1 !important;transition-duration: .01ms !important;scroll-behavior: auto !important}}.place-details{padding: var(--spacing-xl)}.detail-image{margin-bottom: var(--spacing-lg);border-radius: var(--radius-xl);overflow: hidden;max-height: 500px;min-height: 300px;background: var(--bg-color);display: flex;align-items: center;justify-content: center}.detail-image img{width: 100%;height: 100%;object-fit: contain;object-position: center}@media (max-width: 768px){.detail-image{max-height: 300px;min-height: 200px}}@media (min-width: 769px) and (max-width: 1024px){.detail-image{max-height: 400px;min-height: 250px}}.detail-content h2{font-size: 2rem;margin-bottom: var(--spacing-lg);color: var(--primary-color)}.detail-meta{display: flex;gap: var(--spacing-lg);margin-bottom: var(--spacing-xl);flex-wrap: wrap}.detail-type,.detail-location{display: flex;align-items: center;gap: var(--spacing-sm);padding: var(--spacing-sm) var(--spacing-md);background: var(--bg-color);border-radius: var(--radius-md);font-weight: 600}.detail-description{margin-bottom: var(--spacing-xl)}.detail-description h3{margin-bottom: var(--spacing-md);color: var(--text-primary)}.detail-description p{color: var(--text-secondary);line-height: 1.8}.admin-info{padding: var(--spacing-lg);background: var(--bg-color);border-radius: var(--radius-lg);margin-bottom: var(--spacing-xl)}.admin-info h3{margin-bottom: var(--spacing-md);color: var(--secondary-color)}.admin-info p{margin: var(--spacing-sm) 0}.detail-actions{display: flex;gap: var(--spacing-md);flex-wrap: wrap}.detail-btn{flex: 1;min-width: 150px;padding: var(--spacing-md) var(--spacing-lg);border-radius: var(--radius-md);color: white;font-weight: 600;display: flex;align-items: center;justify-content: center;gap: var(--spacing-sm);transition: var(--transition-fast);border: none;cursor: pointer;font-size: 1rem;font-family: inherit}.detail-btn.whatsapp{background: #25D366}.detail-btn.call{background: #0088cc;text-decoration: none}.detail-btn.call:hover{background: #006fa1}.detail-btn.maps{background: #4285F4}.detail-btn.menu{background: var(--primary-color)}.detail-btn.share{background: #6c757d}.detail-btn:hover{transform: translateY(-2px);box-shadow: var(--shadow-lg)}@keyframes slideIn{from{transform: translateX(100%);opacity: 0}to{transform: translateX(0);opacity: 1}}@keyframes slideOut{from{transform: translateX(0);opacity: 1}to{transform: translateX(100%);opacity: 0}}.branches-list{margin-bottom: var(--spacing-xl)}.branches-list h3{margin-bottom: var(--spacing-md)}.branch-item{display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;gap: 8px;padding: 10px 12px;margin-bottom: 8px;background: var(--bg-color);border-radius: var(--radius-md)}.branch-item strong{display: block;font-size: .95rem}.branch-item small{color: var(--text-secondary)}.branch-actions{display: flex;gap: 6px}.branch-actions a{width: 34px;height: 34px;border-radius: 10px;display: inline-flex;align-items: center;justify-content: center;color: #fff;font-size: 1rem}.branch-actions .wa{background: #25D366}.branch-actions .mp{background: #4285F4}.branch-actions .ph{background: #0088cc}.card-branches{margin: 0;font-size: .75rem;color: var(--secondary-color);font-weight: 600;display: flex;gap: 4px;align-items: center}@media (max-width: 640px){.card-branches{font-size: .62rem}}.branches-hint{color: var(--text-secondary);font-size: .85rem;margin-bottom: 10px}.branch-row{border: 1px dashed var(--border-color);border-radius: var(--radius-lg);padding: 12px;margin-bottom: 12px;background: var(--bg-color)}.branch-row-head{display: flex;justify-content: space-between;align-items: center;margin-bottom: 8px}.branch-remove{width: 34px;height: 34px;border-radius: 10px;border: 0;cursor: pointer;background: #fee2e2;color: #dc2626}.btn-add-branch{width: 100%;min-height: 44px;border: 2px dashed var(--primary-color);color: var(--primary-color);background: transparent;border-radius: var(--radius-md);font-weight: 700;cursor: pointer;font-family: inherit}.btn-add-branch:disabled{opacity: .5;cursor: not-allowed}