.popover-max-width{max-width:220px}.container{width:500px;height:500px}.image-container:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);z-index:1}.card-footer{z-index:2}.gradient-bg{background:linear-gradient(180deg,#0c1323,#1c2b49);border-radius:16px;display:flex;align-items:center;padding:20px;color:white;box-shadow:0 4px 10px rgba(0,0,0,.2);overflow:hidden}.image-container{position:relative;width:100%;height:400px;margin:10px}.image-container img{object-fit:cover}.main-payment-method-container{display:grid;grid-template-columns:repeat(3,1fr);align-items:center;justify-content:center;gap:16px;padding:16px}.payment-method-container{display:flex;flex-direction:column;align-items:center;gap:16px;padding:16px;border:1px solid #ccc;border-radius:8px;background-color:#fff}.delete-button{background-color:red;color:white;padding:8px 12px;border:none;border-radius:15px;cursor:pointer}.delete-button:hover{background-color:darkred}@media (max-width:500px){.main-payment-method-container{grid-template-columns:1fr}}.checkout-container{display:flex;flex-direction:column;align-items:center;gap:16px;padding:16px;width:100%;max-width:600px;margin:auto}.select-container{display:flex;align-items:center;gap:12px;justify-content:center}.select-dropdown{width:250px}.info-button{background:none;border:none;cursor:pointer;font-size:18px}.popover-content{padding:8px;text-align:left;max-width:250px}.popover-title{font-weight:700;font-size:14px}.popover-text{font-size:12px;color:#555}.switch-container{display:flex;justify-content:flex-end;width:100%}.save-button{background-color:#007bff;color:white;padding:10px 20px;border:none;border-radius:5px;cursor:pointer;width:100%;max-width:250px}.save-button:hover{background-color:#0056b3}@media (max-width:500px){.checkout-container{width:100%;max-width:none;padding:12px}.select-container{flex-direction:column;align-items:center;width:100%}.switch-container{justify-content:center}.save-button{width:100%}}.lesson-package-container{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}.lesson-package-container>*{flex:1 1 calc(50% - 16px);min-width:250px}@media (max-width:500px){.lesson-package-container>*{flex:1 1 100%}}.create-parent-player-container{display:flex;flex-direction:column}@media (max-width:500px){.create-parent-player-container{display:grid;grid-template-columns:repeat(2,1fr)}}.side-bar-container{display:grid}@media (max-width:500px){.side-bar-container{display:grid}}.card-container-max-width{max-width:calc(100vw - 5px)}.side-bar-container-drawer{max-width:260px!important}.side-bar-div-size{width:205px}.general-info-section{width:100%}.general-info-section,.payment-section{padding:2rem 1rem;border-radius:12px;margin:0 auto}.payment-section{max-width:1200px}.general-info-section-title,.section-title{font-size:1.5rem;font-weight:600;margin-bottom:1.5rem;color:#1f2937;border-bottom:2px solid #e5e7eb;padding-bottom:.5rem}.card-grid{flex-direction:row;gap:1.5rem;justify-items:center}.card-grid,.card-wrapper{display:flex;align-items:start}.card-wrapper{flex-direction:column;gap:1rem;padding:1rem}.form-row{display:flex;flex-direction:row;gap:1rem;margin-bottom:1rem}.form-row.single{flex-direction:column}.form-row>*{flex:1;min-width:0}@media screen and (max-width:768px){.form-row{flex-direction:column;gap:.75rem}.form-row.single{margin-top:.5rem}.general-info-section-title,.section-title{font-size:1.25rem;margin-bottom:1rem}.general-info-section,.payment-section{padding:1rem .75rem}.card-grid{flex-direction:column;gap:1rem;justify-content:center;justify-items:center}.card-wrapper{width:100%;padding:.75rem;justify-content:center;align-items:center}}.delete-card{border-color:#0c1323;border-width:1px;padding:0;background:transparent;transition:transform .2s ease,box-shadow .2s ease;cursor:pointer;height:100%}.delete-card:hover{transform:scale(.98);box-shadow:0 0 0 2px #dc2626}.delete-card:hover .credit-card{filter:brightness(.95) saturate(1.2);background-color:rgba(220,38,38,.05);border-color:#dc2626;transition:background-color .2s ease,border-color .2s ease}@keyframes shake{0%{transform:translateX(0)}25%{transform:translateX(-2px)}50%{transform:translateX(2px)}75%{transform:translateX(-2px)}to{transform:translateX(0)}}.delete-card:hover{animation:shake .3s ease-in-out}